This.nextSibling не работает

Я ожидаю, что следующий код выведет "out"

<input type=text onfocus="alert(this.nextSibling.id)" />
<output id="out">this is output</output>

Но он предупреждает undefined Почему?

Ответ 1

nextSibling выбирает самого следующего sibling node элемента. Самый следующий node также может быть textNode, который не имеет свойства id, поэтому вы получаете значение undefined. Как и в другом ответе, вы можете использовать свойство nextElementSibling, которое ссылается на следующий sibling node, который имеет nodeType of 1 (т.е. Объект Element) или удаляет скрытые символы между элементами.

Обратите внимание, что IE8 не поддерживает свойство nextElementSibling.

Ответ 2

Попробуйте следующее:

alert(this.nextElementSibling.id);

Примечание: Свойство nextSibling возвращает node сразу после указанного node на том же уровне дерева.

Свойство nextElementSibling только для чтения возвращает элемент, следующий за указанным в списке родительских дочерних элементов, или null, если указанный элемент является последним в списке.

Ответ 3

Предполагая, что вы можете использовать jQuery

Обратите внимание, что this.nextSibling может не работать в IE специально

Альтернативой jQuery для this.nextSibling является $(this).next()