這是查詢元素及其子元素的最佳方式嗎？

我試圖查詢一個元素和其子女查找以特定字符串開頭的ID。這是查詢元素及其子元素的最佳方式嗎？

var foundIDs = containerElement.find('[id^=something]').andSelf().filter('id^=something');

的find()方法只搜索的後代，所以我想我會嘗試andSelf()。但是，andSelf()不帶選擇器。這意味着包含容器元素，無論它是否與find查詢相匹配，然後我必須執行第二個filter()以刪除容器元素，如果它完全不匹配的話。

我試圖把andSelf()的find()之前，但它似乎沒有容器元素拿起入堆棧。

containerElement.andSelf().find('[id^=something]');

有沒有更好的方法來實現我在做什麼？

來源

2010-05-29 Soviut

只是把我的頭頂部（未測試）：

var foundIDs = containerElement 
        .filter('id^=something') 
        .add(containerElement.find('id^=something'));

這是不是比你的第一次努力更有效，但我認爲這是一個小清潔。

來源

2010-05-29 18:44:10

我想有沒有避免必須使用相同的選擇器兩次。 – Soviut 2010-05-29 19:23:07

containerElement.find('*').andSelf().filter('[id^=something]');

來源

2010-05-29 18:57:06 James

應該可以工作，但是我想看看那個的性能 – 2010-05-29 19:01:28

有道理，但是在find中使用選擇器的版本將減少查詢集，以便稍後處理過濾器的次數會減少。 – Soviut 2010-05-30 00:05:57

我知道你已經接受了一個答案，但我仍然會拋出這個問題。

var foundIDs = containerElement.wrap('<div>')    // Wrap 
           .parent()     // Traverse up 
           .find('[id^=something]'); // Perform find 

containerElement.unwrap(); // DOM is untouched

因爲你解纏containerElement前的功能齊全，DOM保持不變（如果你想知道）。

我使用livequery插件對其進行了驗證，該插件從未檢測到新的div。

如果你登錄foundIDs的ID（或其他），你會看到，頂層是你的containerElement（假設它匹配.find()標準

console.log(foundIDs.attr('id')); // Log the ID of the root element.

編輯：

關於測試，我在兩個版本上執行了1000次迭代循環，而對於只有2個嵌套元素的containerElement。

我只在Mac上的Safari中測試過。

接受的答案快了大約7倍。

如果我添加了100個嵌套元素，則間隙縮小到2倍以內。

~~這是麻煩。如果containerElement不匹配，那麼兩個版本都返回0個元素。我不確定這是爲什麼。~~

來源

2010-05-29 22:01:23 user113716

聰明，但它感覺相當hackish。我想知道堆棧上會出現什麼樣的性能衝擊？ – Soviut 2010-05-30 00:04:56

@Soviut - 好問題。我做了一些測試。我會用我非正式的，半不科學的結果來更新我的答案。需要注意的一點是，如果'containerElement'與'.find（）'中的選擇符不匹配，那麼接受的答案似乎完全失敗。 – user113716 2010-05-30 00:44:46

@Soviut - 無視我對選擇器失敗的評論。我正在犯一個笨蛋錯誤。儘管我發現比兩個答案都快的方法。我會將其發佈在我的答案的頂部。 – user113716 2010-05-30 01:00:00

這一個比我的其他答案有更好的表現，但你失去了你接受的答案提供的鏈接能力。

// Do a typical find. 
var found = containerElement.find('[class^=something]'); 

    // Test the containerElement directly, 
    // and push it into the 'found' object if it matches. 
if(containerElement.is('[class^=something]')) found.push(containerElement);

來源

2010-05-30 11:04:41 user113716

由於我如何處理我收到的'each（）'containerElement，我試圖在單個查詢中完成所有操作。 – Soviut 2010-05-30 19:39:41

@Soviut - 是的，我認爲你選擇的答案是一個很好的答案。 – user113716 2010-05-30 19:42:47

這是查詢元素及其子元素的最佳方式嗎？

回答

相關問題