是否可以在条件语句中链接 hasClass() 或 is() ？

Question

我注意到我网站的代码中有很多以下类型的条件语句：

//Example 1
if ($("#myDiv1").hasClass("myClass1")) {
    $("#myDiv1").hide();
}

//Example 2
if (!$("#myDiv2").is(":hover")) {
    $("#myDiv2").slideUp("slow");
}

整理一下的明显方法如下：

//Example 1
var e1 = $("#myDiv1");
if (e1.hasClass("myClass1")) {
    e1.hide();
}

//Example 2
var e2 = $("#myDiv2");
if (!e2.is(":hover")) {
    e2.slideUp("slow");
}

但是，我想知道尽管有 if 声明，我是否可以以某种方式链接这些函数。试了这两行代码（没想到行不通）；

//Example 1
var e1 = $("#myDiv1");
if (e1.hasClass("myClass1").hide()); //Attempt1

e1.hasClass("myClass1").hide(); //Attempt2

当if 语句和if 语句的参数相同时，是否有任何方法链接条件？

Answer 1

重写它以减少代码的一种方法如下。这种风格利用了 JavaScript 评估布尔语句的方式，有时被称为“短路”。基本上每行的第二部分（在 && 之后）只有在第一部分为真时才会执行。

$("#myDiv1").hasClass("myClass1") && $("#myDiv1").hide();
!$("#myDiv2").is(":hover") && $("#myDiv2").slideUp("slow");

Answer 2

这很简单。组合你的选择器：

$('#myDiv1.myClass1').hide();

和

$('#myDiv2:not(:hover)').slideUp();

Answer 3

在使用其中一种方法作为getter 后，您不能链接方法。由于hasClass() 严格来说是一个getter，它是jQuery API 中为数不多的永远不能被链接的方法之一。

您不能链接到的其他 getter 示例：

$(selector).val() ; /* returns string or array*/
$(selector).css('color'); /* with only one argument will return a value and not the element collection */

当用作设置器时，上述两个方法都可以链接，因为它们将返回选择器引用的元素集合：

$(selector).val(400).addClass('someClass') ;
$(selector).css('color','blue').somePlugin();