选择距离索引n处的同级（JavaScript）

我正在寻找一种遍历DOM元素同级元素的方法，如

。nextSibling（）

允许，但不限于直接的下一个同级元素

例如，如果我想相对于当前节点移动3个同级节点，我可以执行类似于

nextSibling（3）

或

同级节点[2]

的操作

---

关于如何在不循环nextSibling n次的情况下实现这一点，您有什么想法吗？

您可以使用

parent.children

数组以及

array.prototype.indexOf

函数

函数（元素，步幅）{
var parent=element.parentNode；
var index=Array.prototype.indexOf.call（parent.children，element）；
返回parent.children[索引+步幅]；
}
var el=document.getElementById（“div-3”）；
var StripdSibling=StripdSibling（el，-2）；
var StratidSibling1=StratidSibling1（el，1）；
console.log（漫游）；
console.log（跨步sibling1）

这是第一组
这是第二组
这是第三组
这是第四组
这是第五组
我想在循环中使用
上一个同级
和
下一个同级
属性进行一些测试，与使用公认的答案相反，我发现否受益于不使用内置节点属性和
for
循环，我发现使用带有
for
循环的属性会带来性能上的好处，这与公认的答案相反，这里是我使用不同数量的同级的基准测试以及运行更多基准测试的JSFIDLE-（），因此简而言之，我的答案是使用您在问题中反对的解决方案，以下数字是使用Chrome版本88.0.4324.146（官方版本）（64位）运行JSFIDLE时收到的：

100000个兄弟姐妹：

接受应答执行时间-21.915000048466027毫秒
将属性与for循环一起使用-8.23499957494438毫秒

10000个兄弟姐妹：

接受应答执行时间-0.8149999775923789毫秒
将属性与for循环一起使用-0.1950000296348432毫秒

1000个兄弟姐妹：

接受应答执行时间-0.18000003183260656毫秒
将属性与for循环一起使用-0.05999991208314896毫秒

编辑：在此处添加了一个代码段，因此不需要外部网站：


const numberofsides=100000//要附加到父级的div数
const startingElement=“div-3000”//要传递到函数中的元素的id
const-stridinum=2000//远离所选起点的兄弟姐妹数
功能（元素、步幅）{
var parent=element.parentNode；
var index=Array.prototype.indexOf.call（parent.children，element）；
返回parent.children[索引+步幅]；
}
函数步幅SiblingSwithPreviousorNext（元素，步幅）{
设sib=null；
如果（步幅>0）{
for（设i=0；i

如果没有父节点该怎么办？Chrome和Firefox总是添加，即使提供了一个空的HTML文件，也会导致成为父节点。这包括两种浏览器，IE、Edge、Safari等。我试用了Edge，它的工作原理是一样的。也许有人可以测试其他浏览器？唯一没有父元素的元素是
html
（即
documentElement
），或者可能是
DocumentFragment
中的元素。你可以修改你的代码来检查
parent
是否为空，如果是空的，用
nextElementSibling
/
previousElementSibling
作为备份，或者干脆退出，说
stripesibles
需要一个父项……如果从性能的角度来看，内置的带有循环的属性更好，你为什么要这么做？请参阅我的答案以及基准测试和JSFIDLE。如果您有代码要共享，最好在堆栈溢出上共享，而不是仅在外部站点上共享。@HereticMonkey添加了一个代码片段，谢谢您的建议。