मैंने jQuery का उपयोग करके पहले बच्चे तत्व का चयन करने के सबसे तेज़ तरीके से चर्चा की है। जैसा कि उम्मीद की जा सकती है, मूल डीओएम पहले चाइल्ड संपत्ति एक jQuery चयनकर्ता या चयनकर्ताओं के संयोजन का उपयोग करने से बहुत तेज है - http://jsperf.com/jquery-first-child-selection-performance/6 देखें। यह आम तौर पर एक समस्या नहीं है - या तो इसका उपयोग ऐसे स्थान पर किया जा रहा है जहां प्रदर्शन एक बड़ा सौदा नहीं है, या केवल डीओएम तत्व तक पहुंचने के लिए पर्याप्त है और इसका उपयोग करें। फर्स्ट चाइल्ड प्रॉपर्टी। हालांकि, इस के साथ एक जोड़ी समस्याएं हैं:jQuery क्यों .firstChild विधि प्रदान नहीं करता है?
- firstChild बल्कि एक तत्व की तुलना में एक पाठ या टिप्पणी नोड लौटा सकता है, के रूप में एक jQuery चयनकर्ता
- वापसी होगी मैं कई तत्वों के पहले बच्चे का चयन करने की जरूरत है , मुझे या तो धीमी चयनकर्ता का उपयोग करना चाहिए, या डीओएम तत्वों पर पुनरावृत्त करने वाले बहुत से अतिरिक्त काम पर जाना चाहिए, उन्हें एक संग्रह में जोड़ना, फिर उन्हें एक jQuery ऑब्जेक्ट में वापस रखना।
ऐसा लगता है कि कोर jQuery लाइब्रेरी में पहली चाइल्ड विधि जोड़ने की लागत लाभ से बहुत छोटी होगी। मैं अपने खुद के इस्तेमाल के लिए इस तरह के एक विधि बनाने पर मेरे अपने शॉट ले लिया:
$.fn.firstChild = function() {
var ret = [];
this.each(function() {
var el = this.firstChild;
//the DOM firstChild property could return a text node or comment instead of an element
while (el && el.nodeType != 1)
el = el.nextSibling;
if (el) ret.push(el);
});
//maintain jQuery chaining and end() functionality
return this.pushStack(ret);
};
परीक्षण मैं http://jsperf.com/jquery-multiple-first-child-selection पर बनाया में, इस समारोह पांच बार से अधिक किसी भी अन्य विकल्प की तुलना में तेजी प्रदर्शन करती है। परीक्षण ऊपर वर्णित परीक्षणों पर आधारित हैं, लेकिन एक तत्व के बजाय, एकाधिक तत्वों के पहले बच्चों का चयन कर रहे हैं।
क्या मुझे कुछ याद आ रही है? एक तकनीक जो मुझे उपयोग करनी चाहिए? या क्या यह एक मुद्दा है जिसके बारे में कभी चिंता नहीं करनी चाहिए? क्या jQuery में इस तरह के फ़ंक्शन को शामिल करने का कोई कारण नहीं है?
+1, मुझे firstElementChild के बारे में पता नहीं था। उत्सुकता के लिए, मुझे यहां एक ब्राउज़र समर्थन चार्ट मिला: http://www.quirksmode.org/dom/w3c_traversal.html – undefined
मुझे यह भी उल्लेख करना चाहिए कि मैंने ऊपर जुड़े जेएसपीआरएफ परीक्षण मामलों में उन्नत प्रथम चाइल्ड फ़ंक्शन जोड़ा है। – undefined
लोग आपके कारण पागल हो गए ... :) [यह] जांचें (http://meta.stackexchange.com/q/129306/173320) बाहर। – gdoron