JQuery का उपयोग करके दूसरा बच्चा प्राप्त करें

Question

$(t).html()

रिटर्न

<td>test1</td><td>test2</td>

मैं ऑब्जेक्ट tdसे दूसरा प्राप्त करना चाहता हूं $(t)। मैंने इसका हल खोजा लेकिन मेरे लिए कुछ भी काम नहीं आया। कोई विचार कैसे दूसरा तत्व प्राप्त करने के लिए?

Answer 1

दूसरे बच्चे को पकड़ो:

$(t).children().eq(1);

या, दूसरे बच्चे को पकड़ो <td>:

$(t).children('td').eq(1);

Comments

क्या अंतर है $(t).children('td').eq(1)और$(t).children()[1]

— ग्रीन लेई

@GreenLei पहले एक शुरुआत के लिए अच्छी तरह से एक jQuery वस्तु देता है, दूसरा एक नोड वस्तु देता है

— anthonygore

क्या यह भी find()jQuery विधि के लिए काम करता है ? जैसा $(t).find('td').eq(1)कि दूसरा पाने के लिए <td>, अगर t, एक मेज, और मुझे 1 नोड से अधिक नीचे देखने की जरूरत है?

— जस्टिन एल।

मैं .children('td').eq(1)किसी कारण से काम नहीं कर सका , लेकिन .find('td').eq(1)बस ठीक काम किया।

— शार्प

Answer 2

यहाँ एक समाधान है जो शायद कोड में पढ़ने के लिए स्पष्ट है:

अनियंत्रित सूची का दूसरा बच्चा पाने के लिए:

   $('ul:first-child').next()

और अधिक विस्तृत उदाहरण: इस कोड को 'my_list' के रूप में पहचाने गए UL के दूसरे बाल तत्व की 'शीर्षक' विशेषता का पाठ मिलता है:

   $('ul#my_list:first-child').next().attr("title")

इस दूसरे उदाहरण में, आप चयनकर्ता की शुरुआत में 'उल' से छुटकारा पा सकते हैं , क्योंकि यह निरर्थक है, क्योंकि एक आईडी एकल पृष्ठ के लिए अद्वितीय होनी चाहिए। यह सिर्फ उदाहरण के लिए स्पष्टता जोड़ने के लिए है।

प्रदर्शन और मेमोरी पर ध्यान दें , ये दो उदाहरण अच्छे प्रदर्शनकर्ता हैं, क्योंकि वे jquery को उन उल्टे तत्वों की सूची नहीं बचाते हैं जिन्हें बाद में फ़िल्टर किया जाना था।

Comments

जब हम प्रदर्शन के बारे में परवाह करते हैं, तो हम आगे बढ़ते हैं और एक संदर्भ रखते हैं ulताकि हमें इसके लिए खोज न करनी पड़े।

— daniel1426

Answer 3

यह कैसा है:

$(t).first().next()

---

मुख्य अद्यतन:

जवाब कितना सुंदर लग रहा है इसके अलावा, आपको कोड के प्रदर्शन के बारे में भी विचार करना होगा। इसलिए, यह जानना भी उचित है कि $(t)चर में वास्तव में क्या है । यह एक सरणी है <TD>या यह एक <TR>नोड है जिसके <TD>sअंदर कई हैं? इस बिंदु को और स्पष्ट करने के लिए, <ul>50 <li>बच्चों वाली सूची में jsPerf स्कोर देखें :

http://jsperf.com/second-child-selector

$(t).first().next()विधि अब तक, यहाँ सबसे तेज है।

लेकिन, दूसरी ओर, यदि आप <tr>नोड लेते हैं और पाते हैं<td> बच्चों एक ही परीक्षण चलाते हैं, तो परिणाम समान नहीं होंगे।

आशा करता हूँ की ये काम करेगा। :)

Answer 4

मैंने इसे यहाँ उल्लेखित नहीं देखा, लेकिन आप CSS युक्ति चयनकर्ताओं का भी उपयोग कर सकते हैं। डॉक्स देखें

$('#parentContainer td:nth-child(2)')

Answer 5

इसे इस्तेमाल करे:

$("td:eq(1)", $(t))

या

$("td", $(t)).eq(1)

Answer 6

JQuery के तरीकों का उपयोग करने के अलावा, आप मूल cellsसंग्रह का उपयोग कर सकते हैं जो <tr>आपको देता है।

$(t)[0].cells[1].innerHTML

मान tलेना एक DOM तत्व है, आप jQuery ऑब्जेक्ट निर्माण को बायपास कर सकते हैं।

t.cells[1].innerHTML

Answer 7

_{यह देखकर आश्चर्य होता है कि किसी ने भी ऐसा करने के लिए देशी जेएस तरीके का उल्लेख नहीं किया है।}

बिना jQuery के:

बस मूल तत्व की childrenसंपत्ति तक पहुंचें । यह उन बच्चों के तत्वों का लाइव HTMLCollection लौटाएगा जिन्हें एक इंडेक्स द्वारा एक्सेस किया जा सकता है। यदि आप दूसरा बच्चा पाना चाहते हैं:

parentElement.children[1];

आपके मामले में, ऐसा कुछ काम कर सकता है: (उदाहरण)

var secondChild = document.querySelector('.parent').children[1];

console.log(secondChild); // <td>element two</td>

<table>
    <tr class="parent">
        <td>element one</td>
        <td>element two</td>
    </tr>
</table>

आप CSS3 चयनकर्ताओं / के संयोजन का उपयोग कर सकते हैं querySelector()और उपयोग कर सकते हैं :nth-of-type()। यह विधि कुछ मामलों में बेहतर काम कर सकती है, क्योंकि आप इस प्रकार के तत्व को भी निर्दिष्ट कर सकते हैं, td:nth-of-type(2) उदाहरण के लिए (उदाहरण)

var secondChild = document.querySelector('.parent > td:nth-of-type(2)');

console.log(secondChild); // <td>element two</td>

Answer 8

प्रयोग .find()विधि

$(t).find("td:eq(1)");

td:eq(x) // x is index of child you want to retrieve. eq(1) means equal to 1. //1 denote second element

Comments

<तालिका> <tr class = "parent"> <td> तत्व एक </ td> <td> तत्व दो </ td> </ tr> </ table>

यदि आपकी टिप्पणी की जानकारी आपके उत्तर के लिए प्रासंगिक है, तो कृपया संपादन के माध्यम से अपने पोस्ट में विवरण जोड़ें। किसी भी तरह से, कृपया अपनी टिप्पणी हटा दें।

— मिकमैकुसा

Answer 9

आप नीचे दिए गए अनुसार jQuery में दो तरीकों का उपयोग कर सकते हैं-

JQuery का उपयोग करना: nth-child चयनकर्ता आपने एक तत्व की स्थिति को इसके तर्क के रूप में रखा है जो कि 2 है जैसा कि आप दूसरे li तत्व का चयन करना चाहते हैं।

$( "ul li:nth-child(2)" ).click(function(){
  //do something
});

JQuery का उपयोग करना: eq () चयनकर्ता

यदि आप सटीक तत्व प्राप्त करना चाहते हैं, तो आपको आइटम के सूचकांक मूल्य को निर्दिष्ट करना होगा। एक सूची तत्व एक सूचकांक 0 से शुरू होता है। ली के 2 तत्व का चयन करने के लिए, आपको तर्क के रूप में 2 का उपयोग करना होगा।

$( "ul li:eq(1)" ).click(function(){
  //do something
});

उदाहरण देखें: jQuery में सूची का दूसरा बाल तत्व प्राप्त करें