如何获取未来元素的父元素在页面中所有相同元素中是第几个?

Question

整段代码是通过js动态添加到页面中的,当b发生变化的时候如何获取a在页面所有a中是第几个(位置)?

<div class="a">
    <div class="b"></div>
</div>

Answer 1

没太明白什么意思

如果 a 的 class 名是不变的，直接使用 jQuery

$(".a").index(this.parent())

其中的 this 是所改变的 b

Answer 2

[...document.querySelector('.b').parentNode.parentNode.children].indexOf(document.querySelector('.b').parentNode)

Answer 3

既然是动态追加的，为什么不在添加到 dom 之前就给一个标识呢？比如：

<div class="a" index="1">
    <div class="b"></div>
</div>
<div class="a" index="2">
    <div class="b"></div>
</div>
...

这样当 b 发生变化，直接取得父级的 index 属性就好了