SYNCERのロゴ
アイキャッチ画像

NonDocumentTypeChildNode.nextElementSibling - 直後の要素

nextElementSiblingは、NonDocumentTypeChildNodeのプロパティです。直後のElementを返します。

概要

名前
nextElementSibling
所属
NonDocumentTypeChildNode
IDL
readonly attribute Element? nextElementSibling;
仕様書
https://dom.spec.whatwg.org/#dom-nondocumenttypechildnode-nextelementsibling

説明

元のElementの直後にあるElementを返します。

チュートリアル

直後に要素を挿入する例です。

<ul>
	<li>要素1</li>
	<li id="hoge">対象の要素</li>
	<li>要素2</li>
</ul>
var element = document.getElementById( "hoge" ) ;

element.nextElementSibling ;	// <li>要素2</li>

デモ

NonDocumentTypeChildNode.nextElementSiblingのデモです。直後の要素を取得します。

<!-- このコードは編集できます。 -->

<!DOCTYPE html>
<html>
<body>
	<ul>
		<li>要素1</li>
		<li id="hoge">対象の要素</li>
		<li>要素2</li>
	</ul>
<hr>
<script>
var element = document.getElementById( "hoge" ) ;

console.log( element.nextElementSibling ) ;
document.body.appendChild( new Text( element.nextElementSibling.outerHTML ) ) ;
</script>
</body>
</html>

サポート状況

ChromeFirefoxSafariEdgeIEOperaiOS SafariAndroid
9+
  • Twitterでシェア
  • Facebookでシェア
  • Google+でシェア
  • はてなブックマークでシェア
  • pocketに保存
  • LINEでシェア
更新履歴
2017年10月4日 (水)
コンテンツを公開しました。