如何使用Javascript删除父元素中重复的数据目标子元素？

使用普通Javascript，如何删除单个父元素中重复的数据目标子元素？有没有一种方法可以做到这一点，而无需将每个元素放入一个数组中，然后过滤该数组

开始

<div class="parent">
  <div class="child" data-target="1"></div>
  <div class="child" data-target="1"></div>
  <div class="child" data-target="2"></div>
  <div class="child" data-target="3"></div>
  <div class="child" data-target="4"></div>
  <div class="child" data-target="1"></div>
  <div class="child" data-target="5"></div>
  <div class="child" data-target="6"></div>
  <div class="child" data-target="7"></div>
  <div class="child" data-target="5"></div>
  <div class="child" data-target="3"></div>
  <div class="child" data-target="8"></div>
  <div class="child" data-target="9"></div>
  <div class="child" data-target="2"></div>
</div>

目标

<div class="parent">
  <div class="child" data-target="1"></div>
  <div class="child" data-target="2"></div>
  <div class="child" data-target="3"></div>
  <div class="child" data-target="4"></div>
  <div class="child" data-target="5"></div>
  <div class="child" data-target="6"></div>
  <div class="child" data-target="7"></div>
  <div class="child" data-target="8"></div>
  <div class="child" data-target="9"></div>
</div>

---

在纯JS中，您可以创建一个目标数组。循环每个

.child

：如果其

数据目标

属性是新的，则将其添加到数组中，否则删除

.child

let targets=[]；
document.querySelectorAll（'.parent.child'）.forEach（child=>{
if（targets.includes（child.getAttribute（'data-target'））{
child.remove（）；
}否则{
targets.push（child.getAttribute（'data-target'））；
}
});

1.
1.
2.
3.
4.
1.
5.
6.
7.
5.
3.
8.
9
2.