Получение следующего и предыдущего типов узлов

#javascript #jquery

#javascript #jquery

Вопрос:

У меня есть следующий HTML:

 <body>Testing1<span id="t1" style="background-color: green;">Testing2</span>Testing3</body>
  

Когда я пытаюсь выполнить следующее:

 alert(window.jQuery('#t1').prev().nodeType); // undefined - tried get(0) as well

alert(window.jQuery('#t1').get(0).nodeType); // 1

alert(window.jQuery('#t1').next().nodeType); // undefined
  

Почему я получаю undefined, когда пытаюсь получить тип узла предыдущего и следующего текстовых элементов?

Странно то, что если я помещаю b тег перед span, prev().get(0).nodeType возвращает a 1 означает ли это, что текстовые узлы и комментарии невозможно обнаружить??

Ответ №1:

Проблема в том, что prev и next возвращает объекты jQuery, а не элементы DOM. Вам придется использовать get снова:

 alert(window.jQuery('#t1').next().get(0).nodeType);
  

Обратите внимание, что вы можете альтернативно использовать синтаксис массива для получения базового элемента DOM по указанному индексу:

 alert(window.jQuery('#t1').next()[0].nodeType);
  

Редактировать

Просто перечитайте свой вопрос и увидите, что вы уже пробовали это. Вы правы, думая об этом prev , и next не получите текстовые или комментирующие узлы. Они получат только элементы.

Текстовый узел, который предшествует #t1 , не является элементом, поэтому prev ничего не возвращает (нет родственных элементов, предшествующих или следующих #t1 ).

Вы могли бы сделать это:

 alert(window.jQuery('#t1').get(0).previousSibling.nodeType); //3
alert(window.jQuery('#t1').get(0).nextSibling.nodeType); //3
  

Но я не совсем уверен в совместимости этих браузеров.

Комментарии:

1. странно то, что firebug сообщает мне undefined в этой get(0) точке — также см. Обновление, о котором идет речь.

2. Я вижу, и что еще более странно, это то, что когда я перебираю все промежутки, используя jQuery, и я делаю это this.nextSibling в цикле. Я могу получить тип узла! Что происходит? Может быть, есть другой способ добиться того, что я пытаюсь сделать?

3. Это потому, что в цикле this будет ссылка на элемент DOM, а не на объект jQuery. Смотрите мое новое редактирование для возможного решения!

4. Потрясающе — это нужно только для тестирования в Firefox, и это работает!

Ответ №2:

Вы могли бы просто использовать обычный js:

 alert(document.getElementById('t1').previousSibling.nodeType);
alert(document.getElementById('t1').nextSibling.nodeType);
  

конечно, вы должны проверить, что getElementById возвращает элемент и что существует следующая / предыдущая привязка, прежде чем пытаться получить его тип узла.