如何使用 jQuery 移除所有的 CSS 类?

Instead of individually calling $("#item").removeClass() for every single class an element might have, is there a single function which can be called which removes all CSS classes from the given element?

Both jQuery and raw JavaScript will work.

转载于:https://stackoverflow.com/questions/1424981/how-to-remove-all-css-classes-using-jquery

13个回答

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

Calling removeClass with no parameters will remove all of the item's classes.


You can also use (but is not necessarily recommended, the correct way is the one above):

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

If you didn't have jQuery, then this would be pretty much your only option:

document.getElementById('item').className = '';
weixin_41568110
七度&光 There is a problem with jQuery UI 1.9. If removeClass() didn't work use removeAttr('class')
3 年多之前 回复
csdnceshi77
狐狸.fox Yes, I also suspect it's a bug, and not by design. In the meantime, the following pure JavaScript works just fine. document.getElementById("item").removeAttribute("class");
4 年多之前 回复
csdnceshi60
℡Wang Yan Seems like a bug introduced in jQuery since their documentation explicitly states this: If a class name is included as a parameter, then only that class will be removed from the set of matched elements. If no class names are specified in the parameter, all classes will be removed. api.jquery.com/removeclass
4 年多之前 回复
csdnceshi77
狐狸.fox Calling removeClass() without parameters does not seem to work anymore in version 1.11.1
4 年多之前 回复
weixin_41568183
零零乙 Shouldn't the attr() version be prop() now?
4 年多之前 回复

Hang on, doesn't removeClass() default to removing all classes if nothing specific is specified? So

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

will do it on its own...

csdnceshi65
larry*wei Now it is documented properly: If no class names are specified in the parameter, all classes will be removed.
6 年多之前 回复
weixin_41568126
乱世@小熊 yeah: "Removes all or the specified class(es) from the set of matched elements."
大约 11 年之前 回复
$('#elm').removeAttr('class');

no longer class attr wil be present in "elm".

weixin_41568208
北城已荒凉 this is what worked for me. removeClass(); did not work for me.
5 年多之前 回复

I like using native js do this, belive it or not!

1.

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

2.

// only remove all class of first item
const item1 = document.querySelector('item');
item1.className = '';

jQuery ways

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

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

csdnceshi66
必承其重 | 欲带皇冠 stackoverflow.com/questions/1485647/…
3 年多之前 回复

Since not all versions of jQuery are created equal, you may run into the same issue I did which means calling $("#item").removeClass(); does not actually remove the class. (Probably a bug)

A more reliable method is to simply use raw JavaScript and remove the class attribute altogether.

document.getElementById("item").removeAttribute("class");

Heh, came searching for a similar answer. Then it hit me.

Remove Specific Classes

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

Say if element has class="class another-class"

Of course.

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

You can just try

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

If you have to access to that element without class name, for example you have to add a new class name, you can do that:

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

I use that function in my projet to remove and add class in a html builder. Good luck.

try with removeClass

For instance:

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>

</div>

Just set the className attribute of the real DOM element to '' (nothing).

$('#item')[0].className = ''; // the real DOM element is at [0]

Edit: Other people have said that just calling removeClass works - I tested this with the Google JQuery Playground: http://savedbythegoog.appspot.com/?id=ag5zYXZlZGJ5dGhlZ29vZ3ISCxIJU2F2ZWRDb2RlGIS61gEM ... and it works. So you can also do it this way:

$("#item").removeClass();
共13条数据 1 尾页
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐