プロパティ nextElementSibling

プロパティ nextElementSibling は、 同じ親要素内にある次の要素を 含みます。そのような要素がない場合、 null が返されます。

構文

javascript要素.nextElementSibling;

例

要素 #elem が与えられています。 その下の兄弟要素のテキストを出力してみましょう:

html<p id="elem">elem</p>
<p>sibling</p>
javascriptlet elem = document.querySelector('#elem');
let text = elem.nextElementSibling.textContent;

console.log(text);

コード実行結果:

javascript'sibling'

例

下の兄弟要素が存在しない場合、または 私たちの要素と同じ親要素内に配置されていない場合も、 null が返されます:

html<div>
  <p id="elem">elem</p>
</div>
<p>sibling</p>
javascriptlet elem = document.querySelector('#elem');
console.log(elem.nextElementSibling);

コード実行結果:

javascriptnull

関連項目