Jquery - 我不應該重復選擇器（存儲在變量中）嗎？

Question

有時我發現自己多次重復選擇器。 我應該以某種方式將jquery對象存儲到變量然后只使用那個？ 作為一個簡單的例子，以下是什么？：

$('a.contactus').css('padding', '10px');
$('a.contactus').css('margin', '4px');
$('a.contactus').css('display', 'block');

現在我知道這不是一個很好的例子，因為有效地你可以鏈接每個css函數。 但是假設每一個都是條件性陳述或某些東西阻止你鏈接。

我可以在變量中存儲jquery對象嗎？ 如果是這樣，我什么時候可以？

Answer 1

當重復使用它（並且你不能鏈）將它存儲在一個變量中並不是一個壞主意，它使用的頻率越高或選擇器越昂貴，將它作為變量存儲就越好。 例如， $(this)幾次的性能是微不足道的，但$("[attr=val]")的性能非常差，如果重復使用，應該絕對緩存。 如果有疑問，請將其緩存為變量。

---

只是另一個提示，在該示例中，您還可以將對象傳遞給.css() ：

$('a.contactus').css({ padding: '10px', margin: '4px', display: 'block' });

Answer 2

我應該以某種方式將jquery對象存儲到變量然后只使用那個？

你應該盡可能為了表現 。 例如，您可以像這樣重寫代碼：

var $el = $('a.contactus');
$el.css('padding', '10px');
$el.css('margin', '4px');
$el.css('display', 'block');

你可以把它縮短得更短：

$el.css({
  padding: '10px',
  margin:'4px',
  display: 'block'
});

在編寫jquery插件以將$(this)存儲在變量中時，將常用/重復選擇器存儲在變量中也很有用。

Answer 3

你可以這樣做

var myvar = $('a.contactus');
myvar.css('padding', '10px').css('margin', '4px').css('display', 'block');

但為了便於閱讀，我這樣做了

var myvar = $('a.contactus');
myvar.css('padding', '10px')
  .css('margin', '4px')
  .css('display', 'block');

基本上每次使用$（someselector）時，你都會遍歷dom。 如果可以，您應該存儲元素引用。