jQuery優化：快速檢查元素是否存在？

在jQuery中，我已經知道如何通過使用由特定選擇器返回的jQuery對象的length屬性來檢查元素是否存在。jQuery優化：快速檢查元素是否存在？

但是，在內部，這意味着jQuery首先抓取所有對象，然後獲取長度。出於性能方面的原因，我想看看是否只有1個元素存在，我不需要搶別人。

我該怎麼做？

來源

2011-06-16 Mathias Lykkegaard Lorenzen

選擇給它分配一個ID或類做到這一點。並單獨獲取該課程。 – MarioRicalde 2011-06-16 18:44:18

如果您可以通過提供一個應該加快速度的環境來縮小範圍。 – ExtraGravy 2011-06-16 18:53:32

我不知道爲什麼這是被拒絕的。 – 2013-05-04 14:39:00

見相關的問題：Optimize jQuery selector with :first

我分出一個jsPerf測試與$("xxx").first()比較$("xxx:first")，看看jQuery的優化，從當使用:first匹配早期保釋出來。它似乎並不被具有優化：

http://jsperf.com/does-first-boost-your-selector/4

更新：.eq(0) VS :eq(0)的工作方式。

所以，你可能運氣不好。似乎沒有更有效的方式來選擇/檢查第一場比賽。除非當然，除了其他人已經注意到的，你可以選擇將選擇器限制到類和標識符，並且在另一個我連接的問題中也已經注意到了。

來源

2011-06-16 19:09:59

在對[@ Ryan的回答]（http://stackoverflow.com/questions/6376923/jquery-optimization-check-if-an-element-exists-fast/6376984#6376984）進行評論時，我發現[jQuery支持]（http://api.jquery.com/first-selector/）你的結論是：'first'沒有幫助。他們實際上建議做一個純粹的CSS選擇器，後面加上'.filter（「：first」）'，因爲'：first'不受本地DOM方法的幫助。 – patridge 2011-06-16 19:49:28

我不確定這是否提高了性能，但您可以使用選擇器過濾僅返回第一個匹配的元素。嘗試這個？

var exists = !$("selector:eq(0)").length == 0;

來源

2011-06-16 18:48:34 Ryan

如果反對是因爲我錯了，那麼請糾正我，讓我知道我錯了。謝謝！ – Ryan 2011-06-16 19:01:27

你最初的回答（在你編輯之前）沒有回答這個問題。現在它是。 – 2011-06-16 19:13:14

第一：我沒有downvote。根據[文檔]（http://api.jquery.com/first-selector/）'：first'相當於'：eq（0）'。它還說「最佳性能」是通過「使用純CSS選擇器，然後使用'.filter（」：first「）'」來實現的。沒有保證，但是這肯定意味着'：first'（以及擴展名'：eq（0）'）不會使任何事情變得快捷。 – patridge 2011-06-16 19:15:07

如果元素你可以使用的document.getElementById（ID），這是尋找任何DOM元素最快的方法的ID。

在dom中，您可以使用getElementsByTagName通過標記名稱查找元素。

對於所有其他情況下使用JQuery。

document.getElementById(id); 
document.getElementById(id).getElementsByTagName(tag);

來源

2011-06-16 18:55:47 ShankarSangoli

當我想檢查是否存在未被ID選中的元素，並且性能是一個問題時，我使用document.querySelector()而不是jQuery。

不像querySelectorAll(),querySelector()似乎只選擇第一個匹配元素，提供了一種有效的方法來檢查元素的存在。

例

if(document.querySelector('a')){ 
    console.log('This document contains at least one anchor tag!'); 
}

您還可以通過從一個jQuery對象

var element = $('#super_special_element'); 

if(element.get(0).querySelector('a')){ 
    console.log('Super special element contains at least one anchor tag!'); 
}

來源

2013-04-25 07:39:24 Loupax

jQuery優化：快速檢查元素是否存在？

回答

相關問題