Question

在jQuery之前，我会使用类似下面的代码来设置元素上的类：

document.getElementById("MyElementID").className = 'MyClassName';

这样做的目的是替换我的新班级名MyClassName

之前的任何内容

在jQuery中，等价物似乎是：

$('#MyElementID').attr('class', 'MyClassName')

但是，我们还有内置的类函数addClass()，removeClass()和toggleClass()。所以为了达到同样的效果，我会说：

 $('#MyElementID').removeClass().addClass('MyClassName');

显然，第一个jQuery示例更简洁，只需要一个函数调用（attr，而不是addClass()和removeClass()）

我们是否也可以假设我不能使用prop作为我正在使用的早期（当前不可更改）的版本。

那么你会说首选方法是什么？第二个样本是否给了我超过第一个样本的东西？

非常感谢提前。

Answer 1

jQuery的addClass（），removeClass（）和has（）方法使用元素的className属性。它们提供的最大优势是它们允许您添加或删除类而不影响其他类名设置。

attr（）方法使用如下内容：

document.getElementById("MyElementID")[name] = value;

对于只需要一个类名的情况，属性方法可能会更快。然而，我个人发现如果你将来需要添加更多的类名，addClass方法会更优雅，更容易适应。

Answer 2

我认为您应该检查所有这些功能的性能。我个人认为 prop 方法最快（在v1.6中引入）

在这里看到性能 jQuery（）。attr vs jQuery（）。data vs jQuery（）。prop

http://jsperf.com/jquery-data-vs-jqueryselection-data/8

Answer 3

不同之处在于这个人：

<div class="a_class another_class a_third_class">

attr（'class'，'no_other_classes_now'）＆lt; - 将替换class属性中的所有内容，即使有多个空格分隔的类也是如此。它可能是最轻量级的JQ方法，因为它只是使用已经在浏览器中正常运行了十多年的DOM方法。

.removeClass（'a_third_class'）将删除一个类，使其他类保持不变。

.addClass（'a_fourth_class'）将添加一个以空格分隔的类，而不替换其他类。

^^这两个必须为一个简单的类覆盖而不是attr做更多的工作，因为他们需要进行查找/替换类型操作。

Prop用于更改没有像窗口对象这样的HTML代表的DOM元素的属性（由于其他便利方法而不太可能经常使用），或者由于不同的属性字符串可能意味着不同的东西而令人困惑。就像简单地使属性“已检查”而没有等号或值等同于checked =“checked”或checked =“true”一样，就布尔（仅真/假）JS属性而言，涉及某些HTML风格。使用prop，您将获得javascript属性，而不一定是实际HTML元素的引号之间的任何内容。

当你不处于那种情况时，我会坚持使用attr方法。道具的整个要点似乎是从旧的attr方法开始，所以如果在大多数情况下它更快，我会感到惊讶。更重要的是，它很常见且易于阅读。

有没有一种使用jQuery设置项目类的首选方法

3 个答案: