javascript - 为 Chrome 优化 jquery 选择器

Question

我有以下 jquery 代码来循环 525 个(我知道，很多!)复选框:

var elements = $("#profile-list table tr input[type=checkbox].email-checkout:not(:checked)");

$.each(elements, function(i) {
    $(elements[i]).attr('checked', 'checked');
});

更新 html 如下所示:

<table>
    <tr>
        <th>Name</th>
        <th>Title</th>
        <th>E-mail</th>
        <th>Telephone</th>
        <th id="email_check"><img src="check_black.png"/></th>
   </tr>
   <?php foreach ($this->profiles as $profile): ?>
        <tr>
            <?php echo $this->presentProfile($profile, 'list') ?>
        </tr>
   <?php endforeach; ?>

这基本上遍历了数据库中的所有配置文件，并为每个配置文件创建了一个表行，其中最后一个表数据包含一个复选框，可以选择将电子邮件发送到该复选框。如果用户单击 ID 为“email_check”的表头，则 javascript 代码应该启动，这就是 Chrome 失败的地方。

我使用以下代码附加事件:

$("#email_check img").live('click', function() {
     //my code
}

当我在 Firefox (mac) 中运行这段代码时，它运行得很顺利，但是当我在 Chrome (mac) 中运行它时，它需要很长时间并最终给我一个窗口，chrome 为我提供了关闭窗口的选项，所以基本上它永远不会完成这个循环。

我一直在尽可能地优化这个选择器，从 jquery 1.3 开始，我知道他们从左到右切换到右到左选择器，这基本上意味着我应该尽量让我的右边选择器尽可能具体。它能比我目前拥有的更具体吗？

还是循环只花了这么长时间？我尝试从 $.each 切换到常规的 for() 而没有得到肯定的结果。

关于如何解决此问题的任何提示或想法？

英吉贝尔

Answer 1

我真的不认为这是一个选择器问题。

您的选择器是 querySelectorAll 的有效选择器，这意味着它将非常快。

我在 Mac 上的 Chrome 中针对一个包含 250 行的表格测试了精确选择器，结果是即时的。

我猜还有其他事情正在发生。