select 并用 JavaScript 删除 class

Question

我有这个代码：

<div class="d-none d-js-block"> ... </div>

如何使用 javascript 选择器删除 class 属性。我正在使用此代码：

var element = document.getElementsByClassName("d-none d-js-block"); element.classList.remove("d-none d-js-block");

我也在用这个代码：

`var element = document.getElementsByClassName("d-d-none d-js-block");
element.removeAttr("class");`

这段代码也不起作用；我怎样才能删除 class?

Answer 1

您需要在 remove() 函数中指定逗号分隔的 class 名称。如果您只有 select 的那个元素并删除 classes:

，也可以使用 querySelector()

var element = document.querySelector(".d-none.d-js-block");
element.classList.remove("d-none", "d-js-block");

.d-none.d-js-block{
  color: red;
}

<div class="d-none d-js-block">
 some HTML
</div>

Answer 2

getElementsByClassName returns a collection.So 您需要传递该集合中元素的索引。

或者您可以使用 querySelectorAll 和 classList.remove

此处使用 setTimeout 只是为了演示删除 class.In 你的代码你可以避免这种情况

var element = document.querySelectorAll('.d-js-block');
setTimeout(function() {
  element.forEach(function(item) {
    item.classList.remove("d-none");
    item.classList.remove("d-js-block");
  })

}, 3000)

.d-none {
  color: green;
}

.d-js-block {
  text-decoration: underline;
}

<div class="d-none d-js-block">
  test</div>

select 并用 JavaScript 删除 class

select and remove class with JavaScript

javascript

jquery

class

selector

getelementsbyclassname