JQuery में अंतिम बाल तत्व का चयन कैसे करें?

Question

JQuery में अंतिम बाल तत्व का चयन कैसे करें?

बस आखिरी बच्चा, उसके वंशज नहीं।

Answer 1

आप यह भी कर सकते हैं:

<ul id="example">
    <li>First</li>
    <li>Second</li>
    <li>Third</li>
    <li>Fourth</li>
</ul>

// possibility 1
$('#example li:last').val();
// possibility 2
$('#example').children().last()
// possibility 3
$('#example li:last-child').val();

: पिछले

.children ()। पिछले ()

:अंतिम बच्चा

Comments

मुझे नहीं लगता children().last()और :last-childयह बराबर है। इस उदाहरण में - हाँ, लेकिन कल्पना करें कि आपके पास दो सूचियाँ हैं (वर्ग = "उदाहरण") और फिर दोनों सूचियों में से अंतिम तत्वों का चयन करने का प्रयास करें ...

— alekwisnia

@alekwisnia मेरा उदाहरण नीचे देखें।

— फिलिप

कौन सा तरीका सबसे तेज़ है?

— विक

@ मैं आपको सटीक उत्तर नहीं दे सकता, लेकिन विकल्प 3 तार्किक होगा। क्योंकि विकल्प 2 डोम का उपयोग करके दो बार कूद रहा है children()। विकल्प 1 इसे एक बार कर रहा है, लेकिन एक कस्टम / jQuery छद्म चयनकर्ता है :lastऔर :last-childयहां बहुत पहले से ही है, क्या मुझे ऐसा लगता है कि यह सबसे तेज़ होगा और परिणाम प्राप्त करने के लिए कम गणना समय लेता है।

— योराम डी लैंगेन

Answer 2

इत्र के लिए:

$('#example').children().last()

या यदि आप एक निश्चित कक्षा के साथ पिछले बच्चे चाहते हैं जैसा कि ऊपर टिप्पणी की गई है

$('#example').children('.test').last()

या एक विशिष्ट कक्षा के साथ एक विशिष्ट बाल तत्व

$('#example').children('li.test').last()

Answer 3

का उपयोग करके : अंतिम बच्चे का चयनकर्ता ?

क्या आपके पास एक विशिष्ट परिदृश्य है जिसे आपको सहायता की आवश्यकता है?

Answer 4

2019 के लिए ...

jQuery 3.4.0 पदावनत कर रहा है: पहला,: अंतिम,: eq:: सम,: विषम,: lt,: gt, और: nth। जब हम Sizzle को हटाते हैं, तो हम इसे querySelectorAll के चारों ओर एक छोटे आवरण से बदल देंगे, और इन चयनकर्ताओं को एक बड़े चयनकर्ता इंजन के बिना पुन: लागू करना लगभग असंभव होगा।

हमें लगता है कि यह व्यापार बंद है। ध्यान रखें कि हम अभी भी स्थिति संबंधी तरीकों का समर्थन करेंगे, जैसे कि .first, .last और .eq। कुछ भी आप स्थितिगत चयनकर्ताओं के साथ कर सकते हैं, आप इसके बजाय स्थितीय तरीकों से कर सकते हैं। वे वैसे भी बेहतर प्रदर्शन करते हैं।

https://blog.jquery.com/2019/04/10/jquery-3-4-0-released/

इसलिए आपको अब (या कोई jQuery) के बजाय .first(), का उपयोग करना चाहिए .last()।

Answer 5

यदि आप अंतिम बच्चे का चयन करना चाहते हैं और तत्व प्रकार पर विशिष्ट होना चाहते हैं तो आप चयनकर्ता के अंतिम प्रकार का उपयोग कर सकते हैं

यहाँ एक उदाहरण है:

$("div p:last-of-type").css("border", "3px solid red");
$("div span:last-of-type").css("border", "3px solid red");

<div id="example">
            <p>This is paragraph 1</p>
            <p>This is paragraph 2</p>
            <span>This is paragraph 3</span>
            <span>This is paragraph 4</span>
            <p>This is paragraph 5</p>
        </div>

पैरा 4 और पैराग्राफ 5 के ऊपर के उदाहरण में, लाल बॉर्डर होगा क्योंकि पैरा 5 डिव में "पी" प्रकार का अंतिम तत्व है और पैरा 4 डिव में अंतिम "स्पैन" है।

Answer 6

हाय सब कृपया इस संपत्ति की कोशिश करो

$( "p span" ).last().addClass( "highlight" );

धन्यवाद