का उपयोग कर तत्वों मैं निम्न HTML नोड संरचना है:गणना तत्काल बच्चे div jQuery
<div id="foo">
<div id="bar"></div>
<div id="baz">
<div id="biz"></div>
</div>
<span></span>
</div>
मैं foo के तत्काल बच्चों, उस प्रकार div के हैं की संख्या की गणना कैसे करते हैं? उपरोक्त उदाहरण में, परिणाम दो (bar और baz) होना चाहिए।
$("#foo > div").length
आईडी 'foo' वाले तत्व के प्रत्यक्ष बच्चे divs हैं। फिर उत्पादित लिपटे सेट के आकार को पुनः प्राप्त करना।
से नीचे मेरा उत्तर देखें, मैं बस शुक्रवार को सोच रहा था कि jQuery के साथ तालिका कॉलम कैसे गिनें। मुझे एक समान दृष्टिकोण का प्रयास करना होगा: '$ ('# table> th')। आकार()'। –
। लम्बाई को प्राथमिकता दी जाती है। http://api.jquery.com/size/ – ScottE
कभी-कभी यह काम नहीं करता है और आपको $ ('# foo') का उपयोग करना होगा। बच्चों()। आकार() जो कि @mrCoder – 472084
$('#foo > div').size()
$("#foo > div")
सभी divs कि #foo
के तत्काल वंशज हैं एक बार आप आप आकार समारोह का उपयोग कर सकते बच्चों के सेट है का चयन करता है:
$("#foo > div").size()
या आप
उपयोग कर सकते हैं$("#foo > div").length
दोनों आपको एक ही परिणाम देगा
var n_numTabs = $("#superpics div").size();
या
var n_numTabs = $("#superpics div").length;
जैसा कि पहले ही कहा गया था, दोनों एक ही परिणाम लौटने।
लेकिन आकार() फ़ंक्शन अधिक jQuery "पी.सी." है।
मुझे अपने पृष्ठ के साथ एक ही समस्या थी।
अभी के लिए, बस छोड़ दें> और इसे ठीक काम करना चाहिए।
descendant चयनकर्ता उस तत्व के बच्चे, पोते, दादाजी, और इसी तरह, #superpics के सभी वंशजों को वापस लौटाएगा, न केवल तत्काल बच्चों – manikanta
अधिक jQuery "पी.सी."। माध्यम ? –
$("#foo > div").length
jQuery एक .size() फ़ंक्शन jQuery दस्तावेज़ में बताए के रूप में जो कई बार एक तत्व प्रतीत होता है कि की संख्या वापस आ जाएगी लेकिन, यह धीमी है और इसीलिए यह .length संपत्ति के रूप में एक ही मान देता है केवल लम्बाई संपत्ति का उपयोग करने के लिए सबसे अच्छा है। यहाँ से: http://www.electrictoolbox.com/get-total-number-matched-elements-jquery/
$("div", "#superpics").size();
यह मायने रखता है ** सभी ** 'div' वंश, न केवल बच्चों। –
मैं बेहतर प्रदर्शन के लिए $('#foo').children().size() उपयोग करना चाहिये।
मैं एक jsperf परीक्षण गति अंतर और children() विधि क्रोम (कैनरी बिल्ड v15) 20-30% में बच्चे चयनकर्ता (#foo> div) कम से कम 60% द्वारा दृष्टिकोण पीटा देखने के लिए बना लिया है फ़ायरफ़ॉक्स में (v4)।
वैसे, कहने की जरूरत नहीं है, ये दो दृष्टिकोण समान परिणाम उत्पन्न करते हैं (इस मामले में, 1000)।
[अपडेट] मैं परीक्षण को नवीनीकृत किया है आकार() बनाम लंबाई परीक्षण शामिल करने के लिए, और वे ज्यादा फर्क नहीं करता है (परिणाम: length उपयोग थोड़ा तेजी से (2%) size() से है)
[अपडेट] ओपी में देखे गए गलत मार्कअप के कारण (मेरे द्वारा 'मार्कअप मान्य' अपडेट से पहले), $("#foo > div").length & $('#foo').children().length दोनों के परिणामस्वरूप (jsfiddle) परिणाम हुआ। लेकिन सही जवाब केवल 'div' बच्चों पाने के लिए, एक ही सही & बेहतर प्रदर्शन
हालांकि इस प्रश्न को कुछ समय पहले पूछा गया है, बस साझा करना चाहता था ताकि यह किसी से मदद कर सके – manikanta
वहां केवल 'div' बच्चों को फ़िल्टर करना कहां है? –
'। लम्बाई 'वास्तव में पसंदीदा विधि है क्योंकि इसमें फ़ंक्शन कॉल का ओवरहेड नहीं है। –
के लिए बच्चे चयनकर्ता का उपयोग करना चाहिए mrCoders के जवाब में jsperf के उत्तरों क्यों सिर्फ डोम नोड का उपयोग नहीं?
var $foo = $('#foo');
var count = $foo[0].childElementCount
आप परीक्षण यहाँ की कोशिश कर सकते हैं: http://jsperf.com/jquery-child-ele-size/7
इस विधि हो जाता है 46,095 सेशन/एस जबकि अन्य तरीके सबसे अच्छे रूप में 2000 सेशन/एस
ओपी ने केवल div बच्चे तत्वों के लिए पूछा – dj18
, आप कर सकते हैं $("#superpics div").children().length का उपयोग करें।
var divss = 0;
$(function(){
$("#foo div").each(function(){
divss++;
});
console.log(divss);
});
<div id="foo">
<div id="bar" class="1"></div>
<div id="baz" class="1"></div>
<div id="bam" class="1"></div>
</div>
मैं अलग दृष्टिकोणों के बीच गति अंतर देखने के लिए एक jsperf परीक्षण जोड़ दिया है। – manikanta