[解決済み] JavaScriptで次の要素/前の要素を取得しますか？

質問

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

例えば、3つの <div> があり、JavaScript のコードでその一つを参照した場合、次の <div> がどれで、どれが前のものかを知りたい。

どのように解決するのですか？

純粋なjavascriptでは、私の考えでは、まずコレクション内でそれらを照合する必要があるでしょう。

var divs = document.getElementsByTagName("div");
//divs now contain each and every div element on the page
var selectionDiv = document.getElementById("MySecondDiv");

つまり、基本的に selectionDiv はコレクションを繰り返し処理してインデックスを見つけ、明らかに -1 = 前 +1 = 次 の範囲に収まるようにします。

for(var i = 0; i < divs.length;i++)
{
   if(divs[i] == selectionDiv)
   {
     var previous = divs[i - 1];
     var next = divs[i + 1];
   }
}

ただし、境界内にいるかどうか、つまりコレクションの終端や始端にいないかどうかをチェックするために、特別なロジックが必要になることに注意してください。

これはまた、子 div がネストされている div があるとします。 そのため、ターゲット div と同じレベルの兄弟のみが必要な場合は、必ず タグ名 プロパティをチェックします。