NonDocumentTypeChildNode.nextElementSibling
概述
nextElementSibling 返回当前元素在其父元素的子元素节点中的后一个元素节点,如果该元素已经是最后一个元素节点,则返回null,
该属性是只读的.
语法
var nextNode = elementNodeReference.nextElementSibling;
例子
<div id="div-01">Here is div-01</div> <div id="div-02">Here is div-02</div> <script type="text/javascript"> var el = document.getElementById('div-01').nextElementSibling; document.write('<p>Siblings of div-01</p><ol>'); while (el) { document.write('<li>' + el.nodeName + '</li>'); el = el.nextElementSibling; } document.write('</ol>'); </script>
上面的例子会输出以下内容:
Siblings of div-01 1. DIV 2. SCRIPT 3. P 4. OL
Internet Explorer 8 支持补丁
该属性不支持IE9之前的版本, 下面的代码片段可以增进对IE8的支持:
// Source: 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;
}
});
}
Internet Explorer 9+ 和 Safari支持补丁
// Source: 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]);
浏览器兼容性
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)
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support (on Element ) |
4 | 3.5 (1.9.1) | 9 | 9.8 | 4 |
Support on CharacterData |
29.0 | 25 (25) [1] | 未实现 | 16.0 | 未实现 |
Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support (on Element ) |
(Yes) | 1.0 (1.9.1) | (Yes) | 9.8 | (Yes) |
Support on CharacterData |
(Yes) | 25.0 (25) | 未实现 | 16.0 | 未实现 |