[英]How can I remove all CSS classes using jQuery/JavaScript?
除了为元素可能具有的每个类单独调用$("#item").removeClass()
,是否有一个可以调用的函数从给定元素中删除所有 CSS 类?
jQuery 和原始 JavaScript 都可以使用。
$("#item").removeClass();
不带参数调用removeClass
将删除项目的所有类。
也可以使用(但不一定推荐,正确的方法是上面的一种):
$("#item").removeAttr('class');
$("#item").attr('class', '');
$('#item')[0].className = '';
如果您没有 jQuery,那么这几乎是您唯一的选择:
document.getElementById('item').className = '';
等等,如果没有指定任何特定内容,removeClass() 是否默认删除所有类? 所以
$("#item").removeClass();
会自己做...
只需将真实 DOM 元素的className
属性设置为''
(无)。
$('#item')[0].className = ''; // the real DOM element is at [0]
其他人说,只是调用removeClass
工作 - 我用 Google jQuery Playground 测试了这个: http : removeClass
...并且它有效。 所以你也可以这样做:
$("#item").removeClass();
当然。
$('#item')[0].className = '';
// or
document.getElementById('item').className = '';
删除特定类:
$('.class').removeClass('class');
假设元素是否具有 class="class another-class"。
最短的方法
$('#item').removeAttr('class').attr('class', '');
你可以试试:
$(document).ready(function() {
$('body').find('#item').removeClass();
});
如果您必须在没有类名的情况下访问该元素,例如您必须添加一个新的类名,您可以这样做:
$(document).ready(function() {
$('body').find('#item').removeClass().addClass('class-name');
});
我在我的项目中使用该函数在 HTML 构建器中删除和添加类。
$('#elm').removeAttr('class');
属性“class”将不再出现在“elm”中。
由于并非所有版本的 jQuery 都是平等的,您可能会遇到我所做的相同问题,这意味着调用 $("#item").removeClass(); 实际上并没有删除该类(可能是一个错误)。
更可靠的方法是简单地使用原始 JavaScript 并完全删除 class 属性。
document.getElementById("item").removeAttribute("class");
// 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 = '';
$("#item").removeClass();
$("#item").removeClass("class1 ... classn");
让我们用这个例子。 也许您希望您网站的用户知道某个字段是有效的,或者需要通过更改该字段的背景颜色来引起注意。 如果用户点击重置,那么您的代码应该只重置有数据的字段,而不必费心遍历页面上的所有其他字段。
此 jQuery 过滤器将仅针对具有此类的输入或选择字段删除类“highlightCriteria”。
$form.find('input,select').filter(function () {
if((!!this.value) && (!!this.name)) {
$("#"+this.id).removeClass("highlightCriteria");
}
});
尝试使用removeClass
。
例如:
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 a Div with class="clase1"</div>
我有一个类似的问题。 就我而言,在禁用元素上应用了 aspNetDisabled 类,并且所有禁用的控件都有错误的颜色。 所以,我使用 jQuery 在我想要的每个元素/控件上删除了这个类,现在一切正常,看起来很棒。
这是我删除 aspNetDisabled 类的代码:
$(document).ready(function () {
$("span").removeClass("aspNetDisabled");
$("select").removeClass("aspNetDisabled");
$("input").removeClass("aspNetDisabled");
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.