テキストノードを除く次の兄弟要素を取得

テキストノードを除く次の兄弟要素を取得するには、element.nextElementSiblingプロパティを使用します。

  • ※ IE8以下は対応していません。

構文

var nextNode = element.nextElementSibling;
戻り値 nextNode 見つかった場合は見つかったノード、見つからなかった場合はnullを返す

サンプルコード

JavaScript

var sampleElement = document.getElementById('sample');

console.log(sampleElement.nextElementSibling);

IE8以下の対応について

IE8以下ではdocument.nextElementSiblingプロパティに対応していないため、次のようにすることで、対応することができます。

関数定義

JavaScript

var getNextElementSiblingExceptTextNodes = function(element) {
	if (element === null) return null;

	var result = element.nextElementSibling;

	if (typeof result !== 'undefined') return result;

	result = element.nextSibling;
	while (result && result.nodeType !== 1) result = result.nextSibling;

	return result;
};

使い方

引数

引数名 説明
第一引数
必須
element Element 要素の直前にある要素

戻り値

見つかった場合は対象のノード、見つからなかった場合はnullを返します。

サンプルコード

JavaScript

var sampleElem = document.getElementById('sample'),
    nextElem   = getNextElementSiblingExceptTextNodes(sampleElem);

alert(nextElem.outerHTML);

JavaScript逆引きリファレンス一覧へ戻る