jQuery選擇器后面的括號和括號是什么意思？

Question

我碰到了這行代碼，我不知道這意味着什么：

$("#theAppContainer")[s > u ? "addClass" : "removeClass"]("something");

我知道第一部分是選擇名為TheAppContainer的元素，第二部分如果s> u則評估為“ addClass”，但是我無法弄清楚這行代碼的總體作用。

Answer 1

方括號語法按名稱獲取屬性的值 ，並且括號會調用該屬性的值的函數。 等效於：

var container = $('#theAppContainer');

if(s > u) {
    container.addClass('something');
} else {
    container.removeClass('something');
}

另外，請不要編寫這樣的代碼。 =）

同樣， toggleClass帶有第二個switch參數，您可以改用它：

$('#theAppContainer').toggleClass('something', s > u);

Answer 2

$("#theAppContainer")返回一個jquery對象。

jqueryObject["addClass"]與jqueryObject.addClass同義

因此， jqueryObject["addClass"]返回jquery對象的addClass方法。

然后，您使用("something")將參數傳遞到該方法中並執行該方法。

所以你實際上是在做

var myJqueryObject = $("#theAppContainer");
if(s > u) {
    myJqueryObject.addClass("something");
}
else {
    myJqueryObject.removeClass("something");
}

Answer 3

方括號符號。

$('#element')['hide'](700)

點表示法：

$('#element').hide(700)

另一個（？ ternary operator被稱為ternary operator

使語句比較返回布爾值，
其中s>u是一條語句，並根據結果使用值：

STATEMENT ? IF TRUE USE THIS : IF FALSE USE THAT ;

如果s > u使用'addClass'否則使用'removeClass'
這意味着您將獲得$("#theAppContainer")["addClass"]("something"); 如果s > u和$("#theAppContainer")["removeClass"]("something"); 如果s===u || s<u s===u || s<u
可以用DOT表示法翻譯為：

$("#theAppContainer").addClass("something");

要么

$("#theAppContainer").removeClass("something");

這不是最好的方法，因為您可以在特定情況下使用toggleClass()方法，但是很高興知道。
而且不應該使用括號表示法是不正確的。 在高級JS中，您將看到所有好處。