使用 JavaScript 过滤掉类成员答案

【问题标题】：Filtering out a class members with JavaScript使用 JavaScript 过滤掉类成员
【发布时间】：2021-06-22 02:59:20
【问题描述】：

这可能是一个简单的问题，但我才刚刚开始编码，请多多包涵……

我有一堆元素，它们都有两个相同的类，partWiel 和 partWielIn。我想从所有人中删除第二类，除了第一类。

基本上，这就是我想要的，但我认为我不能在这些方括号内使用数学运算符： partWiel[>0].classList.remove("partWielIn");

我该怎么做？

【问题讨论】：

欢迎来到 Stack Overflow！访问help center，使用tour 了解内容和How to Ask。如果您遇到困难，请发布您的尝试minimal reproducible example，并使用[<>] sn-p 编辑器记录输入和预期输出。
类似document.querySelectorAll('. partWiel').forEach((el, i) => if (i > 0) el.classList.remove('partWiel'))。请参阅classList 和由 querySelectorAll 返回的 NodeList 实现的 NodeList#forEach method。
@RobG 你不能这样做，它会给出错误，因为如果第一个语句是if，则需要括号{}。像这样：document.querySelectorAll('. partWiel').forEach((el, i) => {if (i > 0) el.classList.remove('partWiel')})
@ManasKhandelwal 不是 forEach 需要 {}，而是第一个语句是 if

标签： javascript class syntax

【解决方案1】：

试试这个

[...document.querySelectorAll(".partWiel")] // get all partWiel into an array
  .slice(1) // drop the first
  .forEach(part => part.classList.remove("partWielIn")); // remove from the rest

.partWiel {
  background-color: red
}

.partWielIn {
  background-color: blue
}

<ul>
  <li class="partWiel partWielIn">partWiel</li>
  <li class="partWiel partWielIn">partWiel</li>
  <li class="partWiel partWielIn">partWiel</li>
  <li class="partWiel partWielIn">partWiel</li>
  <li class="partWiel partWielIn">partWiel</li>
  <li class="partWiel partWielIn">partWiel</li>
  <li class="partWiel partWielIn">partWiel</li>
</ul>

【讨论】：

【解决方案2】：

下面的呢？

var elements = document.querySelectorAll(".partWiel");

elements.forEach(function (element, index) {
    if (index != 0) {
        element.classList.remove("partWielIn");
    }
});

【讨论】：

【解决方案3】：

1- 首先选择“partWiel”类的所有元素：

const list = document.querySelectorAll('.partWiel');

2- 循环遍历元素并从除第一个元素之外的所有元素中删除“partWeilIn”类：

for(let i = 1; i < list.length; i++) {
    list[i].classList.remove("partWielIn")
}

【讨论】：

你应该使用let i = 1;
当然，再遍历一遍就好了。完美，谢谢！