jQuery緩存選擇器

我有ID爲#wrapper的div和所有元素都在裏面。我做jQuery緩存選擇器

var $wrapper = $('#wrapper');

現在任何時候我想做出選擇或引用一個元素的緩存封裝，我做

$wrapper.find('#whatever').click(....

通過這樣做，我避免再次與jQuery對象包裝，所以我將來所做的任何選擇都將基於緩存的$wrapper。但另一方面，當我使用find()緩存$ wrapper，我知道它會搜索#wrapper內的所有元素。我的問題是更好，使用緩存變量一起查找然後發出點擊事件，或者只是簡單地做$('#whatever').click(..

whatever可以是類或id。

來源

2011-05-01 Pinkie

如果你使用它，其中whateverID是ID然後$('#whateverID').click(..會給你稍微好一點的性能，但是如果whateverCLASS是階級或大於ID其他任何東西，$wrapper.find('whateverCLASS').click(....會更好，因爲穿越將被限制在特定的容器，該容器的子集整個DOM

來源

2011-05-01 02:02:52

性能明智的是緩存DOM元素的「包裝」版本。否則，如果您的DOM真的很大或者您正在做很多次，那麼您每次都會在遍歷DOM時使用$("#myElem")。

來源

2011-05-01 01:56:10 CarlosZ

找不到（）也很貴。我做了性能測試，看起來非緩存版本更快。 http://jsperf.com/testttttt – Pinkie 2011-05-01 01:57:44

我認爲你的測試有問題，因爲你正在執行'var $ wrapper = $（「wrapper」）'''$ wrapper.find（「＃editable」）。hide（） '每次迭代。 – CarlosZ 2011-05-01 02:03:15

這正是我的問題。因爲它會引用具有指定的id或class的所有元素，所以找不到與緩存變量一起使用的好東西。 – Pinkie 2011-05-01 02:07:59

這兩者並不完全等效。您的緩存版本實際上與$("#wrapper #whatever")相同，如果它不包含在包裝div中，它將不會與編號爲whatever的元素匹配。

如果你總是想要爲#whatever元素是#wrapper內，然後$('#whatever')實際上可能比你的緩存版本速度更快 - 調查由ID元素包含一個函數調用，getElementById，這適用於所有的瀏覽器，而你緩存版本涉及檢查層次結構以確保匹配的#whatever元素從#wrapper下降。

來源

2011-05-01 01:56:53 meagar

所有元素都包含在內#wrapper – Pinkie 2011-05-01 01:59:05

在我的問題，我指出，無論可能是一個類或ID。你是否說不要緩存更好？ – Pinkie 2011-05-01 02:00:20

@Pinkie處理ID時最好不要緩存。使用類時，使用緩存方法會更快。最好的做法是自己測試一下。嘗試兩個版本並衡量其相對性能非常微不足道。 – meagar 2011-05-01 02:02:41

約$（ '選擇'，上下文）等等...

$('#whatever', $wrapper)

搜索的DOM只在$包裝

上下文是什麼

當您搜索單個分支或樹枝時，不要搜索整棵樹。

來源

2012-11-22 09:11:54 Willabee

我認爲這在功能上等同於'$ wrapper.find（'＃whatever'）' – vol7ron 2013-03-19 19:02:01

jQuery緩存選擇器

回答

相關問題