NonDocumentTypeChildNode.nextElementSibling
NonDocumentTypeChildNode.nextElementSibling
свойство только для чтения, возвращающее последующий элемент перед текущим, или null
, если элемент является последним в своём родительском узле.
Синтаксис
var nextNode = elementNodeReference.nextElementSibling;
Пример
<div id="div-01">Это div-01</div>
<div id="div-02">Это div-02</div>
<script type="text/javascript">
var el = document.getElementById('div-01').nextElementSibling;
console.log('Сосед div-01:');
while (el) {
console.log(el.nodeName);
el = el.nextElementSibling;
}
</script>
Этот пример выведет в консоль следующее:
Сосед div-01: DIV SCRIPT
Полифил для IE8
Данное свойство не поддерживается до IE9. Используйте следующий полифил, чтобы обойти этот недостаток:
// Источник: https://github.com/Alhadis/Snippets/blob/master/js/polyfills/IE8-child-elements.js
if (!('nextElementSibling' in document.documentElement)) {
Object.defineProperty(Element.prototype, 'nextElementSibling', {
get: function() {
var e = this.nextSibling;
while (e && 1 !== e.nodeType) {
e = e.nextSibling;
}
return e;
}
});
}
Полифил для IE9+ и Safari
// Источник: https://github.com/jserz/js_piece/blob/master/DOM/NonDocumentTypeChildNode/nextElementSibling/nextElementSibling.md
(function(arr) {
arr.forEach(function(item) {
if (item.hasOwnProperty('nextElementSibling')) {
return;
}
Object.defineProperty(item, 'nextElementSibling', {
configurable: true,
enumerable: true,
get: function() {
var el = this;
while (el = el.nextSibling) {
if (el.nodeType === 1) {
return el;
}
}
return null;
},
set: undefined
});
});
})([Element.prototype, CharacterData.prototype]);
Спецификации
Specification | Status | Comment |
---|---|---|
DOM Определение 'ChildNodenextElementSibling' в этой спецификации. |
Живой стандарт | Split the ElementTraversal interface in ChildNode , ParentNode , and NonDocumentTypeChildNode . This method is now defined on the former.The Element and CharacterData interfaces implemented the new interface. |
Element Traversal Specification Определение 'ElementTraversal.nextElementSibling' в этой спецификации. |
Устаревшая | Added its initial definition to the ElementTraversal pure interface and use it on Element . |
Совместимость с браузерами
We're converting our compatibility data into a machine-readable JSON format.
This compatibility table still uses the old format,
because we haven't yet converted the data it contains.
Find out how you can help! (en-US)
Браузеры | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Базовая поддержка (Element ) |
4 | 3.5 (1.9.1) | 9 | 9.8 | 4 |
Поддержка CharacterData |
29.0 | 25 (25) [1] | Нет | 16.0 | Нет |
Браузеры | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Базовая поддержка ( Element ) |
(Да) | 1.0 (1.9.1) | (Да) | 9.8 | (Да) |
Поддержка CharacterData |
(Да) | 25.0 (25) | Нет | 16.0 | Нет |
[1] Firefox 25 также добавил это свойство в DocumentType
(en-US), но оно было удалено в Firefox 28, из-за проблем совместимости.
Смотрите также
- Чистый интерфейс
ChildNode
. - Типы объектов, реализующих этот чистый интерфейс:
CharacterData
,Element
, иDocumentType
(en-US).