在 jQuery 中，是否建议在添加该类之前检查一个类是否已分配给一个元素？它甚至会产生任何影响吗？
例如：
<label class='foo'>bar</label>
如果不确定类 baz 是否已分配给 label，这是最好的方法吗：
var class = 'baz';
if (!$('label').hasClass(class)) {
$('label').addClass(class);
}
或者这样就足够了：
$('label').addClass('baz');
【问题讨论】：
.hasClass，如果我只需要分配类-我使用.addClass。 jQuery 不会复制类
$("label")
.not(".foo")
.addClass("foo");
【讨论】：
关注another which was marked as a duplicate of this one，这个问题引起了我的注意。
此答案总结了已接受的答案，并添加了一些细节。
您正试图通过避免不必要的检查来进行优化，在这方面您必须注意以下因素：
class="collapse"，则调用 Element.classList.add("collapse"); 不会添加额外的 collapse 类。我不知道底层实现，但我想它应该足够好。addClass 和removeClass 实现中进行了一些必要的检查（我检查了source code）。对于addClass，在进行了一些检查并且如果一个类存在，JQuery 不会尝试再次添加它。与removeClass 类似，JQuery 会按照cur.replace( " " + clazz + " ", " " ); 的方式做一些事情，只有当一个类存在时才会删除它。值得注意的是，JQuery 在其removeClass 实现中进行了一些优化，以避免无意义的重新渲染。是这样的
...
// only assign if different to avoid unneeded rendering.
finalValue = value ? jQuery.trim( cur ) : "";
if ( elem.className !== finalValue ) {
elem.className = finalValue;
}
...
因此，您可以做的最佳微优化是为了避免函数调用开销和相关的实现检查。
假设您要切换名为 collapse 的类，如果您完全控制何时添加或删除该类，并且如果 collapse 类最初不存在，那么您可以进行如下优化：
$(document).on("scroll", (function () {
// hold state with this field
var collapsed = false;
return function () {
var scrollTop, shouldCollapse;
scrollTop = $(this).scrollTop();
shouldCollapse = scrollTop > 50;
if (shouldCollapse && !collapsed) {
$("nav .branding").addClass("collapse");
collapsed = true;
return;
}
if (!shouldCollapse && collapsed) {
$("nav .branding").removeClass("collapse");
collapsed = false;
}
};
})());
顺便说一句，如果您因为滚动位置的变化而切换类，强烈建议您使用throttle 滚动事件处理。
【讨论】：
只需致电addClass()。 jQuery 将为您进行检查。如果您自己检查，则工作量会增加一倍，因为 jQuery 仍然会为您运行检查。
【讨论】：
在控制台中进行简单的检查会告诉您，使用同一个类多次调用 addClass 是安全的。
具体可以在the source找到支票
if ( !~setClass.indexOf( " " + classNames[ c ] + " " ) ) {
setClass += classNames[ c ] + " ";
}
【讨论】：