Я изменяю ID элемента HTML div
на стороне клиента с помощью JavaScript. Следующий код работает нормально в Internet Explorer, но не в Firefox/2.0.0.20. Он работает в более новых версиях Firefox.
document.getElementById('one').id = 'two';
Кто-нибудь может мне подсказать:
Чтобы пояснить, я изменяю ID элемента для ссылки на другой стиль во внешней таблице стилей. Стиль применяется в IE, но не в FF.
Он действительно работает в Firefox (включая 2.0.0.20
). См. http://jsbin.com/akili (добавьте /edit
к url для редактирования):
<p id="one">One</p>
<a href="#" onclick="document.getElementById('one').id = 'two'; return false">Link2</a>
Первый клик изменяет id
на "два"
, второй клик выдает ошибку, потому что элемент с id="один"
теперь не может быть найден!
Возможно, у вас уже есть другой элемент уже с id="два"
(FYI вы не можете иметь более одного элемента с одинаковым id
).
Это, кажется, работает для меня:
<html>
<head><style>
#monkey {color:blue}
#ape {color:purple}
</style></head>
<body>
<span id="monkey" onclick="changeid()">
fruit
</span>
<script>
function changeid ()
{
var e = document.getElementById("monkey");
e.id = "ape";
}
</script>
</body>
</html>
Ожидаемое поведение - изменить цвет слова "фрукты".
Возможно, ваш документ был загружен не полностью, когда вы вызывали эту процедуру?
Вы можете изменять id
без необходимости использовать getElementById
.
Пример:
<div id = 'One' onclick = "One.id = 'Two'; return false;">One</div>
Вы можете посмотреть его здесь: http://jsbin.com/elikaj/1/
Проверено с Mozilla Firefox 22 и Google Chrome 60.0