jquery - 为什么我的 jquery td click 事件在 Chrome 上 react 慢？

Question

我有一个大表(大约 500 行和 7 列)。 我的代码只需要检查我单击的表格单元格(它将“保留”类添加到单击的单元格，此类执行一些简单的边框操作)。

它在 Firefox 和 Opera 上运行顺畅，但在 Chrome 上却很糟糕(我的意思是我必须等待大约一秒钟才能更改单元格的边框)- 你能建议我一种修复它的方法吗？

第一个 IF 用于一些其他检查，但它只是检查这个特定点击单元格的状态。

$("td").click( function() 
{
    if($(this).attr('system') !=  1)
    {
        if($(this).attr("reserved") != "1" && $(this).attr("reserved") != "2")
        {
            if($(this).attr("_checked")=="1")
            {
                $(this).addClass("reserved"); // here it changes border color
            }

        }
}

Answer 1

您可以尝试缓存选择器:

$("td").click( function() 
{
    var $this = $(this);

    if($this.attr('system') !=  1)
    {
        if($this.attr("reserved") != "1" && $this.attr("reserved") != "2")
        {
            if($this.attr("_checked")=="1")
            {
                $this.addClass("reserved"); // here it changes border color
            }

        }
}