共计 687 个字符，预计需要花费 2 分钟才能阅读完成。
我们经常通过 document.getElementById 方法来获取到一个元素，这个时候我们经常需要有一个需求，那就是如何判断这个元素在父元素中的位置。
包含文本和注释节点原生 JS 有一个常见的小技巧那就是通过元素的 previousSibling 属性，额外需要注意的是该属性会遍历 text 节点，即回车键。
从零开始我们可以这样的代码获取到一个元素属于父元素的第几个子元素。
var child = this;
while((child = child.previousSibling) != null )
i++;
案例代码如下：
Html:
<ul id=”ul”><li>123</li><li id=”a”>a</li><li>b</li><li>c</li></ul>
JS:
var child = document.getElementById(“a”);
var i = 0;
while((child = child.previousSibling) != null) i++;
console.log(i) //console 1
通过循环遍历 previousSibling 属性是否为 null 这个小技巧，就可以获取到当前元素在父元素中的位置了。
不包含文本节点和注释节点实现代码如下：
var child = document.getElementById(“a”);
var parent = child.parentNode;
var index = Array.prototype.indexOf.call(parent,child);
console.log(index)//1
原文链接：https://www.pipipi.net/code/9…