如何用jQuery/JavaScript删除所有的CSS类？

是否有一个单一的函数，可以从给定的元素中删除所有的CSS类，而不是为每个元素可能有的类单独调用$("#item").removeClass()？

jQuery和原始的JavaScript都可以工作。

Mori
已编辑的问题 1日 四月 2019 в 8:39
编程
javascript jquery dom
15日 九月 2009 в 3:34
40 种观点
解决办法
$("#item").removeClass();

调用 "removeClass"，没有任何参数，将删除该项目所有的类。

你也可以使用（但不一定推荐，正确的方式是上面的方式）。

$("#item").removeAttr('class');
$("#item").attr('class', '');
$('#item')[0].className = '';

如果你没有jQuery，那么这几乎是你唯一的选择。

document.getElementById('item').className = '';
Esteban Küber
编辑本段答案15日 九月 2009 в 11:07
评论(5)

等等，如果没有指定任何特定的内容，removeClass()不是默认为删除所有的类吗？ 所以

$("#item").removeClass();

会做它自己的...

评论(2)

只要将真正的DOM元素的className属性设置为''（无）。

编辑：其他人说，只要调用removeClass就可以了--我用谷歌JQuery Playground测试了一下：http://savedbythegoog.appspot.com/?id=ag5zYXZlZGJ5dGhlZ29vZ3ISCxIJU2F2ZWRDb2RlGIS61gEM ......就可以了。所以你也可以这样做。

$("#item").removeClass();
Isaac Waller
编辑本段答案15日 九月 2009 в 3:42
评论(0)

当然了。

$('#item')[0].className = '';
// or
document.getElementById('item').className = '';
评论(0)

呵，来搜索类似的答案。 然后我就想到了。

删除特定类

$('.class').removeClass('class');

说如果元素有class="class another-class&quot。

评论(0)

最短的方法

$('#item').removeAttr('class').attr('class', '');
评论(0)

你可以试试

$(document).ready(function() {
   $('body').find('#item').removeClass();
});

如果你需要访问该元素而不使用类名，例如你需要添加一个新的类名，你可以这样做。

$(document).ready(function() {
   $('body').find('#item').removeClass().addClass('class-name');
});

我在我的projet中使用该功能在html构建器中删除和添加类。 祝您好运。

Alessandro Foolish Ciak DAnton
编辑本段答案3日 七月 2017 в 6:17
评论(0)
$('#elm').removeAttr('class');

不再有类attr出现在"榆树"中。

Dave
编辑本段答案31日 一月 2017 в 1:17
评论(1)

我喜欢用native js做这个，信不信由你!

// remove all items all class  
const items = document.querySelectorAll('item');
for (let i = 0; i < items.length; i++) {
    items[i].className = '';
}
// only remove all class of first item
const item1 = document.querySelector('item');
item1.className = '';

jQuery方式

  1. $("#item").removeClass();。

  2. $("#item").removeClass("class1 ... ... classn"); 3.

评论(1)

让我们'使用这个例子。 也许你想让你网站的用户知道一个字段是有效的，或者它需要通过改变字段的背景颜色来关注。 如果用户点击重置，那么你的代码应该只重置有数据的字段，而不是费心去循环浏览你页面上的其他每个字段。

这个jQuery过滤器将删除类"highlightCriteria&quot。 只用于 &gt.的输入或选择字段。 具有该类的输入或选择字段。

$form.find('input,select').filter(function () {
    if((!!this.value) && (!!this.name)) {
        $("#"+this.id).removeClass("highlightCriteria");
    }
});
评论(0)

由于不是所有版本的jQuery都是一样的，你可能会遇到和我一样的问题，这意味着调用$("#item").removeClass()。 实际上并没有删除该类。 (可能是个bug)

更可靠的方法是简单地使用原始JavaScript并完全删除类属性。

document.getElementById("item").removeAttribute("class");
Vincent
编辑本段答案20日 六月 2016 в 8:30
评论(0)

用 "removeClass "试试

为例。

<！--开始片段。 js hide: false console: true babel.false --> -- begin snippet: js hide: false console: true false -->

var nameClass=document.getElementsByClassName("clase1");
console.log("after", nameClass[0]);
$(".clase1").removeClass();
var nameClass=document.getElementsByClassName("clase1");
console.log("before", nameClass[0]);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="clase1">I am Div with class="clase1"</div>

<！--结束片段-->

评论(0)

我也有类似的问题。 在我的情况下，在禁用的元素被应用的aspNetDisabled类和所有禁用的控件有错误的颜色。 所以，我使用jquery删除这个类的每一个元素/控件，我不想和一切工作，现在看起来很棒。

这是我删除aspNetDisabled类的代码。

$(document).ready(function () {

    $("span").removeClass("aspNetDisabled");
    $("select").removeClass("aspNetDisabled");
    $("input").removeClass("aspNetDisabled");

});
评论(0)