jQuery优化有效的过滤,然后添加类到多个元素

jQuery optimize efficient for filtering then adding class to multiple element

本文关键字:元素 添加 然后 有效 优化 过滤 jQuery      更新时间:2023-09-26

给定一个元素列表,我需要通过一些属性进行过滤,并为符合条件的元素添加一个类。

由于数据集可能很大,我只是想知道是否一种方法比另一种方法快

假设listOfElement是给定的,由许多元素组成我还想返回每个符合条件的元素的值

方法1:

for(var i = 0; i < listOfElement.length ; i ++){
    if ( testing condition ) {
        $(listOfElement[i]).addClass("blah");
        selected.push(listOfElement[i];
    }
}
方法2:

selected = listOfElement.filter(...);
$(selected).addClass("blah")

我想知道$选择操作和addClass操作的性能成本。如果有人能给我指出一些JavaScript指南的文档,以获得更好的性能(例如,使用隐藏/显示比插入/删除DOM更快),那就太好了

原生JavaScript通常(如果不是总是)比jQuery更快,因为jQuery涉及到$对象的创建。

var selected = listOfElement.filter(function (item) {
    // ...
});
// Add class
selected.forEach(function (item) {
    item.classList.add('blah'); 
    // If you need to support IE 9 or lower:
    // item.className += ' blah'; // note the space in front of the class name
});

您可能会对这个jsPerf感兴趣。