使用 JavaScript 和正则表达式从 DOM 中删除类名答案

【问题标题】：Removing class names from the DOM using JavaScript and Regular Expressions使用 JavaScript 和正则表达式从 DOM 中删除类名
【发布时间】：2018-04-14 12:18:57
【问题描述】：

我想以一种优雅/高效的方式从 DOM 中的一系列节点中删除多个类名。有没有办法通过结合使用正则表达式和 classList.remove() 来实现这一点？注意我正在寻找纯 JavaScript 中的解决方案。

HTML 代码

<div class="x">x</div>
<div class="o">o</div>

我目前的方法

document.querySelectorAll("div").forEach(function(currEl) {
    currEl.classList.remove("x");
    currEl.classList.remove("o");
})

我的问题 - 以下不起作用；但是，是否存在类似的东西？

document.querySelectorAll("div").forEach(function(currEl) {
    currEl.classList.remove(/[xo]/);
});

【问题讨论】：

$('div.x, div.o').removeClass('x o');
谢谢图沙尔；但是，我正在寻找纯 JavaScript 的解决方案 - 我更新了我的问题以强调这一点。
或 currEl.classList.remove('x', 'o');

标签： javascript html regex dom

【解决方案1】：

不完全是你问的，但这可能会有所帮助

document.querySelectorAll("div").forEach(function(currEl) {
    currEl.classList.remove("x","o");
});

【讨论】：

【解决方案2】：

您可以在 querySelectorAll 中传递多个选择器。

试试这个：

var currEl = document.querySelectorAll("div.x, div.o");
for (var i = 0; i < currEl.lenght; i++) {
    currEl[ i ].className.remove();
}

【讨论】：

【解决方案3】：

使用扩展语法添加或删除多个类。您可以根据需要将更多类推送到数组中...

let cls = ["foo", "bar"];

然后：

currEl.classList.remove(...cls);

【讨论】：