Подтвердить что ты не робот

Как изменить идентификатор элемента HTML с помощью JavaScript?

Я изменяю идентификатор клиентской стороны элемента HTML div с помощью JavaScript. Следующий код работает нормально в Internet Explorer, но не в Firefox/2.0.0.20. Он работает в более поздних версиях Firefox.

document.getElementById('one').id = 'two';

Может ли кто-нибудь сказать мне:

  • Почему это не работает в FireFox.
  • Как сделать эту работу в FireFox.

Чтобы уточнить, я меняю идентификатор элемента, чтобы ссылаться на другой стиль во внешней таблице стилей. Стиль применяется в IE, но не в FF.

4b9b3361

Ответ 1

Он работает в 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 на "two", ошибки второго щелчка, потому что элемент с id="one" теперь не может быть найден!

Возможно, у вас есть еще один элемент с id="two" (FYI у вас не может быть более одного элемента с тем же id).

Ответ 2

Это похоже на меня:

<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>

Ожидаемое поведение - изменить цвет слова "фрукты".

Возможно, ваш документ не был полностью загружен при вызове подпрограммы?

Ответ 3

Вы можете изменить 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