Node.nextSibling
nextSibling は Node インターフェイスの読み取り専用プロパティで、指定されたノードの親の childNodes の中で、そのすぐ次のノードを返します。または、指定されたノードが親要素の最後の子要素である場合は null を返します。
Note: ブラウザーはソースのマークアップにあるホワイトスペースを表すために、文書に Text ノードを挿入します。
そのため、例えば Node.firstChild や Node.previousSibling を使用して得たノードが、取得しようとした実際のノードではなく、ホワイトスペースのテキストノードであることがあります。
DOM でのホワイトスペースの記事に、この動作に関する詳しい情報があります。
Element.nextElementSibling を使用すると、ホワイトスペースのノードや要素間のテキスト、コメントなどを飛ばして次の要素を取得することができます。
子ノードのリストで反対方向に移動する場合は、 Node.previousSibling を使用してください。
値
現在のノードの次の兄弟ノードを表す Node、または存在しない場合は null です。
例
<div id="div-1">こちらは div-1 です。</div>
<div id="div-2">こちらは div-2 です。</div>
<br/>
<output><em>計算結果がありません。</em></output>
let el = document.getElementById('div-1').nextSibling,
i = 1;
let result = "div-1 の兄弟要素:<br/>";
while (el) {
result += i + '. ' + el.nodeName+"<br/>";
el = el.nextSibling;
i++;
}
const output = document.getElementsByTagName("output")[0];
output.innerHTML = result;
仕様書
| Specification |
|---|
| DOM Standard # ref-for-dom-node-nextsibling① |
ブラウザーの互換性
BCD tables only load in the browser