jQuery的性能，.css或addClass

我有一个很大的jQuery代码，我在思考我的功能的速度表现。当一个元素被点击（mousedown）我需要分配一个图像作为背景。我可以通过2种方式做到这一点：jQuery的性能，.css或addClass

$('#element li.class').css({"background":"someimageURL"});

或

$('#element li.class').addClass("someclass");

其中 “SomeClass的” 有实际的CSS背景图像。女巫功能在这种情况下效果更好。

有没有办法测试各种功能的速度？

谢谢

来源

2010-02-25 Mircea

我不认为它明智的一个替换为其他。使用.css方法将样式硬编码到DOM元素，并且当您想要摆脱样式（例如，屏幕分辨率更改）时，它会非常棘手。但.addClass和.removeClass方法处理得很好。 – thethakuri 2015-07-23 03:03:01

我几乎可以肯定.addClass()将两者的速度更快。这主要涉及元素的另一个类名，而替代方法则需要迭代元素样式并设置许多显式规则。

通过$.css()设置一对夫妇的css规则可能没有什么可担心的，但是如果你发现自己设置很多，经常是时候创建一个类并根据需要应用/删除它。

我已经提取了两种方法的逻辑到一个单一的位置供您查看，如果你喜欢。

http://pastie.org/842738

来源

2010-02-25 18:24:14 Sampson

也不是速度/性能相关的，改变一个CSS类比JS源代码更容易以后改变样式;） – casraf 2010-02-25 18:26:18

“addClass”的实现并不像我想象的那样奇特。当添加多个类时，它会对类字符串进行大量重新扫描。对于简短的className值可能不是问题。 – Pointy 2010-02-25 18:35:32

Thanx Jhonathan。我会看你的链接。我也认为addClass更快。 – Mircea 2010-02-25 18:35:48

添加类是绝对速度更快，看到的$.addClass()这个性能测试VS $.css() VS $.removeClass().addClass() VS纯JS - http://jsperf.com/jquery-css-vs-addclass-speed/2

来源

2014-01-15 23:09:43

您的jsperf肯定会展示如果您想要执行性能，最重要的事情是跳过jQuery部分并将其直接编码到DOM。用实际测量值来回答性能问题的荣誉！我无法相信这个问题的接受答案是零实际测量。这在我的书中是一个耻辱。如果不进行测量，您无法可靠地回答性能问题。 – jfriend00 2015-04-24 00:22:48

jQuery的性能，.css或addClass

回答

相关问题