JQuery में सूचकांक द्वारा एक तत्व प्राप्त करें

Question

मेरे पास एक अनियंत्रित सूची और उस सूची में एक liटैग का सूचकांक है । मुझे liउस सूचकांक का उपयोग करके तत्व प्राप्त करना होगा और इसकी पृष्ठभूमि का रंग बदलना होगा। क्या यह पूरी सूची को लूप किए बिना संभव है? मेरा मतलब है, क्या ऐसी कोई विधि है जो इस कार्यक्षमता को प्राप्त कर सकती है?

यहाँ मेरा कोड है, जो मुझे विश्वास है कि काम करेगा ...

<script type="text/javascript">
  var index = 3;
</script>

<ul>
    <li>India</li>
    <li>Indonesia</li>
    <li>China</li>
    <li>United States</li>
    <li>United Kingdom</li>
</ul>

<script type="text/javascript">
  // I want to change bgColor of selected li element
  $('ul li')[index].css({'background-color':'#343434'});

  // Or, I have seen a function in jQuery doc, which gives nothing to me
  $('ul li').get(index).css({'background-color':'#343434'});
</script>

Comments

जिन दो तरीकों का आप उपयोग कर रहे हैं वे jQuery ऑब्जेक्ट्स के बजाय डोम तत्वों को लौटाते हैं। इसलिए .css पर कॉल उन पर काम नहीं करेगा। Eq का उपयोग करते हुए नीचे दारा का जवाब है कि आप क्या चाहते हैं।

— रिचर्ड डाल्टन

Answer 1

$(...)[index]      // gives you the DOM element at index
$(...).get(index)  // gives you the DOM element at index
$(...).eq(index)   // gives you the jQuery object of element at index

डोम ऑब्जेक्ट्स में cssफ़ंक्शन नहीं होता है, अंतिम का उपयोग करें ...

$('ul li').eq(index).css({'background-color':'#343434'});

डॉक्स:

.get(index) रिटर्न: तत्व

• विवरण: jQuery ऑब्जेक्ट द्वारा मेल किए गए DOM तत्वों को पुनः प्राप्त करें।
• देखें: https://api.jquery.com/get/

.eq(index) रिटर्न: jQuery

• विवरण: निर्दिष्ट सूचकांक में एक से मेल खाने वाले तत्वों के सेट को कम करें।
• देखें: https://api.jquery.com/eq/

Answer 2

आप .eq()एक निश्चित सूचकांक के साथ तत्व प्राप्त करने के लिए jQuery की विधि का उपयोग कर सकते हैं ।

$('ul li').eq(index).css({'background-color':'#343434'});

Answer 3

आप ईक विधि या चयनकर्ता का उपयोग कर सकते हैं :

$('ul').find('li').eq(index).css({'background-color':'#343434'});

Comments

आप चयनकर्ता को सरल बना सकते थे $('ul li').eq(index).css({'background-color':'#343434'});

— गदोरन

लेकिन ज्यादातर ब्राउज़रों में चयनकर्ता $('ul').find('li')तेज है। [१ , २ ]

— डेरियस

Answer 4

CSS :nth-of-typepseudo-class का उपयोग करके jQuery में सूचकांक द्वारा एक तत्व प्राप्त करने का एक और तरीका है :

<script>
    // css selector that describes what you need:
    // ul li:nth-of-type(3)
    var selector = 'ul li:nth-of-type(' + index + ')';
    $(selector).css({'background-color':'#343434'});
</script>

अन्य चयनकर्ता हैं जिनका उपयोग आप किसी भी तत्व से मेल खाने के लिए jQuery के साथ कर सकते हैं।

Answer 5

आप jquery को छोड़ सकते हैं और बस CSS स्टाइल टैगिंग का उपयोग कर सकते हैं:

 <ul>
 <li>India</li>
 <li>Indonesia</li>
 <li style="background-color:#343434;">China</li>
 <li>United States</li>
 <li>United Kingdom</li>
 </ul>