चयन jQuery

Question

में केवल प्रथम स्तर तत्वों मैं इस तरह एक सूची से केवल माता-पिता <ul> का लिंक तत्व का चयन कैसे कर सकते हैं?

<ul> 
<li><a href="#">Link</a></li> 
<li><a href="#">Link</a> 
    <ul> 
    <li><a href="#">Link</a></li> 
    <li><a href="#">Link</a></li> 
    <li><a href="#">Link</a></li> 
    <li><a href="#">Link</a></li> 
    <li><a href="#">Link</a></li> 
    </ul> 
</li> 
<li><a href="#">Link</a></li> 
<li><a href="#">Link</a></li> 
<li><a href="#">Link</a></li> 

सीएसएस ul li a में

तो, लेकिन नहीं ul li ul li a

धन्यवाद

Answer 1

$("ul > li a") 

लेकिन आप रूट उल पर एक वर्ग सेट करना होगा यदि आप विशेष रूप से लक्षित करना चाहते हैं बाहरीतम उल:

<ul class="rootlist"> 
... 

तो यह है:

$("ul.rootlist > li a").... 

सुनिश्चित करें कि आप केवल रूट ली तत्व बनाने का एक और तरीका है:

$("ul > li a").not("ul li ul a") 

यह kludgy लग रहा है, लेकिन यह चाल

Answer 2

एक बार जब आप है क्या करना चाहिए प्रारंभिक उल, आप children() विधि का उपयोग कर सकते हैं, जो केवल तत्व के तत्काल बच्चों पर विचार करेगा। जैसा कि @activa बताता है, रूट तत्व को आसानी से चुनने का एक तरीका यह है कि इसे कक्षा या आईडी दें। निम्नलिखित मानते हैं कि आपके पास आईडी root आईडी के साथ रूट उल है।

$('ul#root').children('li'); 

Answer 3

आप यूएल के प्रत्यक्ष बच्चों को केवल $("ul li:first-child") का उपयोग भी कर सकते हैं।

मैं हालांकि इस बात से सहमत हैं, तो आप एक आईडी या कुछ और की जरूरत है अन्यथा मुख्य यूएल पहचान करने के लिए यह सिर्फ उन सब का चयन करेंगे। आप यूएल के चारों ओर एक आईडी के साथ एक div था ऐसा करने के लिए सबसे आसान काम हो जाएगा $("#someDiv > ul > li")

Answer 4

.add_to_cart >>> .form-item:eq(1) 

दूसरा .add_to_cart से पेड़ स्तर बच्चे को .form-आइटम

Answer 5

आप इस प्रयास करना चाहें यदि परिणाम अभी भी बच्चों के लिए बहते हैं, तो कई मामलों में JQuery अभी भी बच्चों पर लागू होगा।

$("ul.rootlist > li > a") 

इस विधि का उपयोग करना: ई> एफ किसी भी एफ तत्व यह है कि एक तत्व ई

बताता JQuery केवल स्पष्ट बच्चों के लिए देखने के लिए का एक बच्चा है मेल खाता है। http://www.w3.org/TR/CSS2/selector.html

Answer 6

के रूप में अन्य उत्तर में कहा गया है, सरल विधि विशिष्ट (आईडी या वर्ग के नाम से) मूल तत्व की पहचान करने और प्रत्यक्ष वंशज का भी उपयोग कर रहा है।

$('ul.topMenu > li > a') 

हालांकि, मैं एक समाधान है जो अलग गहराई डोम की पर अज्ञात तत्वों पर काम करेगा की तलाश में इस सवाल बारे में जाना।

यह प्रत्येक तत्व की जाँच, और यह सुनिश्चित करना है कि यह मेल नहीं खाते तत्वों की सूची में एक जनक नहीं है के द्वारा प्राप्त किया जा सकता है।यहां एक jQuery चयनकर्ता 'टॉपस्टो' में लपेटा गया मेरा solution है।

jQuery.extend(jQuery.expr[':'], { 
    topmost: function (e, index, match, array) { 
    for (var i = 0; i < array.length; i++) { 
     if (array[i] !== false && $(e).parents().index(array[i]) >= 0) { 
     return false; 
     } 
    } 
    return true; 
    } 
}); 

इस का उपयोग, मूल पोस्ट का हल है:

$('ul:topmost > li > a') 

// Or, more simply: 
$('li:topmost > a') 

पूरा jsFiddle उपलब्ध here।

Answer 7

इस प्रयास करें:

$("#myId > UL > LI") 

Answer 8

मैं किसी भी गहराई से नेस्टेड वर्गों के साथ कुछ परेशानी थी, इसलिए मैं इस पता लगा।

var $elementsAll = $("#container").find(".fooClass");4 
 

 
var $levelOneElements = $elementsAll.not($elementsAll.children().find($elementsAll)); 
 

 
$levelOneElements.css({"color":"red"})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div class="fooClass" style="color:black"> 
 
Container 
 
    <div id="container"> 
 
    <div class="fooClass" style="color:black"> 
 
     Level One 
 
     <div> 
 
     <div class="fooClass" style="color:black"> 
 
      Level Two 
 
     </div> 
 
     </div> 
 
    </div> 
 
    <div class="fooClass" style="color:black"> 
 
     Level One 
 
     <div> 
 
     <div class="fooClass" style="color:black"> 
 
      Level Two 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

Answer 9

, बस आप इस का उपयोग कर सकते उदाहरण ..

$("ul li a").click(function() { 
    $(this).parent().find(">ul")...Something; 
} 

देखें:: https://codepen.io/gmkhussain/pen/XzjgRE