jquery - 减少 jquery 选择器的重复使用

Question

我正在学习 jquery，我发现我一直在写这样的东西:

if ($("#Menu").zIndex()<200) {
    $("#Menu").zIndex(250)
    return;
}
else
{
    $("#Menu").zIndex(100)
    return;
}

我认为一定有一种方法可以不必重复 $("#Menu") 类型选择器太多。我发现我可以将 $("#Menu") 分配给一个变量，然后使用它，但会破坏掉漂亮的“.zIndex”方法。或者我可以用函数做一些事情。

针对这种情况的最佳做法是什么？

Answer 1

表明您将使用 jQuery 元素或 DOM 中的某些内容的一个很好的指示是在变量前加上 $。这样，您就知道您正在操作一些 HTML 元素，而不是一些仅 javascript 运行所需的标准 var 元素。

因此，您可以使用任何您想要的 var 名称。我只是决定使用 $m 来展示它比 $menu 或 $("#menu") 更容易编写p>

编辑:将其缓存到变量中的另一个好处是您的jQuery不必清理整个文档 每次调用它时。 感谢@AdamMerrifield 的标注

因此，类似的事情是典型的做法。

var $m = $('#menu');

if($m.zIndex() < 200) {
    $m.zIndex(250);
    return;
} else {
    $m.zIndex(100);
    return;
}

此外，您甚至可以使用三元运算符进一步缩短代码。

Learn More With Interactive Lesson

复制自@Hardy的回复:

var $m = $('#menu');
var new_z = $m.zIndex() < 200 ? 250 : 100; 
$m.zIndex(new_z);