如果語句沒有重複選擇器？

Question

有了這個簡單的例子..

if ($('.target').is(':hidden')) { 
    $('.target').show(); 
} else { 
    $('.target').hide(); 
} 

我很好奇，如果它可以被優化，也許是這樣的：

if ($('.target').is(':hidden')) { 
    .show(); 
} else { 
    .hide(); 
} 

或$（本）..

if ($('.target').is(':hidden')) { 
    $(this).show(); 
} else { 
    $(this).hide(); 
} 

---

不一定嚴格相關的這個例子，我知道我可以使用切換.. T他只是最簡單的if/else例子，我認爲它可以用作例子。

Answer 1

當然，具有可變

var element = $('.target'); 

if (element.is(':hidden')) { 
    element.show(); 
} else { 
    element.hide(); 
} 

和jQuery有一個漂亮的toggle()方法做同樣的事情

$('.target').toggle(); 

走向深水區的，你也可以做這樣的東西

(function(el) { 
    el[el.is(':hidden')?'show':'hide'](); 
})($('.target')); 

還有其他一些方法

Answer 2

這兩者都不適合你。您必須首先將目標另存爲變量。

var $target = $('.target'); 
if ($target.is(':hidden')) { 
    $target.show(); 
} else { 
    $target.hide(); 
} 

如果你真的想保持的東西短，試試這個：

var $target = $('.target'); 
$target[$target.is(':hidden') ? 'show' : 'hide'](); 

但實際上，僅僅使用jQuery的toggle方法。

$('.target').toggle(); 

Answer 3

在你的例子中，你只是在顯示和隱藏一個元素之間進行切換。 JQuery有一個方法。它只是叫.toggle（）--- http://api.jquery.com/toggle/

所以，如果你只是想顯示和隱藏的東西，你可以說

$('.target').toggle(); 

另外，如果有涉及更多的邏輯，這是有利的，每當您將選擇器包裝到$中時，緩存您的jQuery變量，您將重新包裝該元素或重新遍歷DOM。

所以：

var target = $('.target'); 
if(target.is(':hidden')) { 
    target.show(); 
} else { 
    target.hide(); 
}