這是一個相當簡單的問題。想象一下,在我的網頁索引中,有一個元素,我們稱之爲#newsletter
,它有一個綁定到它的jquery事件。該元素在我的網站的其他子頁面上不存在。 現在,在我的JavaScript文件中,我應該只將綁定限制爲元素存在時(用戶在索引上)還是jQuery自動執行此操作?在我將一個函數綁定到它之前,我應該測試一個目標元素是否存在?
實際上,現在我所擁有的是:在我的.js文件中,函數綁定到所有子頁面上的該元素,即使該元素不存在那裏。這是一個問題嗎?
這是一個相當簡單的問題。想象一下,在我的網頁索引中,有一個元素,我們稱之爲#newsletter
,它有一個綁定到它的jquery事件。該元素在我的網站的其他子頁面上不存在。 現在,在我的JavaScript文件中,我應該只將綁定限制爲元素存在時(用戶在索引上)還是jQuery自動執行此操作?在我將一個函數綁定到它之前,我應該測試一個目標元素是否存在?
實際上,現在我所擁有的是:在我的.js文件中,函數綁定到所有子頁面上的該元素,即使該元素不存在那裏。這是一個問題嗎?
從錯誤的角度來看,這不會是一個問題,因爲如果沒有元素匹配您指定的選擇器,jQuery不會拋出異常等。
但是,這可能是一個性能問題,具體取決於您的選擇器表達式的複雜程度以及您在沒有這些元素的頁面上做了多少其他此類jQuery調用。如果它很多,你可能想要進一步分解你的JS腳本,並只加載每頁相關的。
由於jQuery中的無效選擇器正常,您不會收到任何錯誤。它只是不會將事件處理程序分配給它。
至於性能方面,它不應該的問題,因爲如果你想這樣做的選擇無論如何都會被解析...
var element = $('#some .complex selector:first > :last-child');
if (element.length) {
element.click(doIt);
}
但是,它可能會更有意義,如果你正在做的更多代碼檢查元素的存在。
當使用jQuery時,不需要檢查元素是否存在。您可以將任何函數/事件綁定到任何元素,並且這些函數將在DOM中存在該元素時起作用。
如果該元素,例如#newsletter,不存在於DOM中,那麼jQuery將跳過綁定你的函數,不會拋出任何異常。當你使用jQuery時,它是100%安全的。
當你在jQuery中使用選擇器時,它實際上會返回一個jQuery對象,而不是一個JavaScript元素。你的事件綁定到一個jQuery對象。
希望能夠說清楚。
它並不真的造成任何減速?我的意思是,如果我第一次測試目標元素是否存在,還是它的總體性能相同,代碼是否會更快執行**? – 2011-03-27 04:29:37
我不完全確定,但如果你只是做一個簡單的ID選擇,你應該沒問題 - 在我看來,開銷太小,你無法嘗試優化它。另一方面,如果你有非常複雜的選擇器,它將花費jQuery時間去瀏覽DOM並找到所有的元素,以便你可以投入和改進。但通常,這值得值得。 – 2011-03-27 04:32:17
@RIMMER:爲了測試它是否存在,最慢的操作(查找它)必須完成,所以我傾向於認爲它不重要。現在,如果你在頁面上放置一個變量來告訴你自己是否將它掛起來,那麼它可能會在不知不覺中變得更快,但是它會在元素的變量和存在不同步的地方問題。 – 2011-03-27 04:32:30