如果语句没有重复选择器？

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(); 
}