使用JavaScript获取下一个/上一个元素？

Question

如何使用JavaScript获取HTML中的下一个元素？

假设我有3个<div>s，并且在JavaScript代码中获得了对1的引用，我想获取哪个是下一个<div>，哪个是前一个。

Answer 1

在纯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不会是兄弟姐妹，而是孩子。因此，如果您只希望与目标div处于同一级别的兄弟姐妹，则必须使用nextSibling检查
tagName 属性。