如何使用JavaScript获取HTML中的下一个元素?
假设我有3个<div>s,并且在JavaScript代码中获得了对1的引用,我想获取哪个是下一个<div>,哪个是前一个。
<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不会是兄弟姐妹,而是孩子。因此,如果您只希望与目标div处于同一级别的兄弟姐妹,则必须使用nextSibling检查 tagName 属性。