在一个元素上添加两次相同的类

Add two times the same class on one element

本文关键字：两次 一个 元素 添加      更新时间：2023-09-26

最近我正在为我的工作对一个遗留项目进行一些重构，我可能偶然发现了一些"bug"。

在框架中的某个地方，一个自定义页面加载程序从端点读取controller/action，并将它们作为两个类应用于主体。

它确实让我们这样说：

$('body').removeAttr("class").addClass(controller + ' ' + action);

以index为控制器，以cars为动作，物体看起来像：

$('body').removeAttr("class").addClass('index cars');
<body class="index cars">

到目前为止还不错（不太好）。

稍后再次匹配您要做的特定元素：

$('.index.cars')

现在，如果操作和控制器的名称相同，就会出现问题。应用了这两个类，比方说cars/cars看起来是这样的：

<body class="cars cars">

选择器$('.index.cars')与上述功能配合良好。

现在有趣的是，如果您尝试使用jQuery1.11.1添加类，那么这是行不通的。它不能在一个元素上添加具有相同名称的第二个类。

所以这个：

$('body').removeAttr("class").addClass('cars cars');
<body class="cars">

不起作用：-（

在谷歌和这里搜索了一点，但找不到什么。

问题是：

在一个元素上有两次相同的类有效吗？如果是的话，那么除了创建一个带有类的选择器之外，还有什么具体的原因会让人这么做吗？

一个元素有多个重复类是有效的。点击此处查看Moz Developer参考资料：https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/class

基本上，无论调用什么，都会识别同一元素的两个实例，但会将其视为一个类。

为了回答你的第二个问题，关于有人利用这个的原因……我个人想不出一个？

对于上面的问题，您将删除元素上的属性"class"，然后将其添加回类值。例如：<div class="car">变成<div>，然后变成<div class="controller action">

你可以用.removeClass来代替.removeAttr

请参见此处：http://api.jquery.com/removeclass/

希望有帮助吗？祝你好运

相关文章：