1

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

//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当语句和语句的参数中的 DOM 元素相同时，是否有任何方法可以链接条件if？

4

3 回答 3

3

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

$("#myDiv1").hasClass("myClass1") && $("#myDiv1").hide();
!$("#myDiv2").is(":hover") && $("#myDiv2").slideUp("slow");
于 2014-09-14T20:56:25.923 回答
2

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

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

和

$('#myDiv2:not(:hover)').slideUp();
于 2014-09-14T21:01:33.750 回答
1

将其中一种方法用作getter. 因为hasClass()严格来说是一个 getter，所以它是 jQuery API 中为数不多的永远不会被链接的方法之一。

您不能链接到的其他吸气剂示例：

$(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();
于 2014-09-14T20:59:10.460 回答