JavaScript を使用して次の要素 / 前の要素を取得しますか? 質問する

JavaScript を使用して次の要素 / 前の要素を取得しますか? 質問する

JavaScript を使用して HTML 内の次の要素を取得するにはどうすればよいですか?

3 つの があり<div>、JavaScript コードで 1 つへの参照を取得する場合、どれが次<div>でどれが前の であるかを取得する必要があります。

ベストアンサー1

使用nextSiblingそしてpreviousSiblingプロパティ:

<div id="foo1"></div>
<div id="foo2"></div>
<div id="foo3"></div>

document.getElementById('foo2').nextSibling; // #foo3
document.getElementById('foo2').previousSibling; // #foo1

ただし、一部のブラウザ (どれだったか忘れました) では、空白とコメント ノードもチェックする必要があります。

var div = document.getElementById('foo2');
var nextSibling = div.nextSibling;
while(nextSibling && nextSibling.nodeType != 1) {
    nextSibling = nextSibling.nextSibling
}

jQuery のようなライブラリは、これらのクロスブラウザチェックをすべてすぐに処理します。

おすすめ記事