Javascript 当我使用jquery来更改dom中的元素时，我到底应该担心多少

在dom中切换某些内容之前，我应该担心多少并检查这些内容。例如，我有两个李当一个按下，然后它应该改变颜色，他的兄弟姐妹应该改变为其他颜色。我真的应该关心检查他的兄弟姐妹们是否已经穿上了他们应该穿的颜色？？在这里编码

$(document).ready(function(){
var $header= $(".header");
var $list = $header.find("ul a");
var $li= $list.find("li");
function changeColor()
    {
        var lightblue = '#A3A3F3';
        var darkblue = '#140C49';
        var white = '#000000';
        $(this).css('background-color',darkblue).css('color','white');
        $(this).siblings().css('backgroundcolor',lightblue).css('color','black');
    }
$li.on('click',changeColor);
});

---

即使我有10个李。。。Jquery真的在压缩计算机吗。

与其担心DOM更改对计算机来说可能太多，不如让代码更具可读性

使用CSS类而不是在Javascript中定义所有样式属性将使函数更容易理解

$function{ 函数标记活动{ $this.closest.header.findli.active.removeClassactive； $this.addClassactive； } $.header.onclick，li，markActive； $timing.clickfunction{ var$lis=$.header li，i，t=Date.now； 对于i=0；i<10000；i++{ $lis.eachmarkActive； } console.logdone 10000 x 4次迭代，在+Date.now中-t+ms； }; }; .标题ul{ 列表样式：无；边距：0；填充：0； } 李局长{ 背景色：A3F3； 颜色：黑色； 浮动：左；宽度：50px；边距：2px；填充：3px；光标：指针； } .头李{ 背景色：140C49； 颜色：白色； } 项目1 项目2 项目3 项目4

---

计时不要担心jQuery，这就是它的设计目的。执行客户端操作，如更改DOM和与服务器端脚本通信。您不必检查li是否已经有了背景色，因为jQuery将很快切换。当然，你可以最好地检查它，但你不必这样做。jQuery几乎不会影响性能。除非你做了很多非常多的动作。只有在下一个动作取决于它是什么的情况下才检查一个值，如果不是，那么简单地更改它会比先检查然后更改更快。你担心错误的事情。你的计算机每秒可以做几千次甚至一万次这样的操作。你的代码可以在其他方面得到改进。我在其他方面也很担心，更重要的是，我只是反应过度，因为我最近学习了reactjs，并且比jquery更快，因为reactjs在dom中更改某些内容之前实际检查，如果它是通过虚拟dom更新的，那么当你到达那里时，不要让它迷惑你。