jQuery: उच्चतम स्तर वाले तत्व जिनमें x

Question

है, मैं उन तत्वों का चयन करने का एक तरीका ढूंढ रहा हूं जिनमें एक निश्चित तत्व है और फिर परिणामों को केवल उच्चतम स्तर प्राप्त करने के लिए फ़िल्टर करें। मुश्किल समझाने लेकिन एक उदाहरण के साथ आसान बना दिया करने के लिए:

<div id="one"> 
    <div id="two"> 
     <div id="three" class="find-me"></div> 
    </div> 
</div> 
<div id="four"> 
    <div id="five" class="find-me"></div> 
</div> 

इस मामले में, मैं अपने सेट चाहेगा #one और #four को रोकने के लिए। अगर मैं ऐसा कुछ करने की कोशिश करता हूं:

var elements = $('div').has('.find-me'); 

मुझे तत्व #one, #two और #four मिलते हैं।

नोट: 'उच्चतम स्तर' तक इस मामले में पहले चयनकर्ता में सर्वोच्च तत्व, $('div') से संबंधित है।

Answer 1

खैर क्या highest level की परिभाषा ही, अगर कोई आपके पृष्ठ में किन्हीं .find-me उच्चतम स्तर माता पिता html टैग होगा क्योंकि व्यवहार में थोड़ा अस्पष्ट है! जो बेकार है।

अपनी समस्या को परिभाषित करके अधिक विशेष रूप से आप इस highest-definition के लिए एक स्पष्ट परिभाषा के साथ आ सकते हैं और उदाहरण के लिए the farthest div parent et। और किसी तत्व के माता-पिता को पार करने के लिए आप .parents() और .closest() विधियों का उपयोग कर सकते हैं।

var farthestDiv = $(".find-me").parents("div").last(); 

जाहिर है अगर आप find-me के एक से अधिक आवृत्तियां है आप एक .each() पाश में इस चलाने के लिए की जरूरत है। http://jsfiddle.net/GsQDb/3/

Answer 2

यदि आप उन सभी को एक बड़ा कंटेनर div में डाल दिया है, तो आप उपयोग कर सकते हैं:

$('.container div.find-me').parents($('.container').children()); 

काम करना चाहिए कि, हालांकि मैं अभी यह परीक्षण करने के लिए मौका नहीं है।

मुझे बताएं कि क्या नहीं है क्योंकि बहुत जटिल समाधान भी हैं।

Answer 3

उन तत्वों को फ़िल्टर करने के लिए फ़िल्टर का उपयोग करें जो आपके पहले चयनकर्ता के बाद जो भी आप चाहते हैं उससे मेल नहीं खाते हैं। उदाहरण:

var elements = $('div.find-me').filter(function(idx){ 
    return !$(this).parents('div.find-me').length; 
}); 

Answer 4

आप शीर्ष सबसे divs करने के लिए एक वर्ग आवंटित कर सकते हैं? यदि ऐसा है तो आप कुछ इस तरह कर सकते हैं:

var elements = $("div.topMost").has(".find-me"); 

Answer 5

यह है कि तुम क्या चाहते हो जाएगा, यह तत्व पहले लगता है और फिर उन के उच्चतम तत्वों खोजने के लिए और पाया उच्चतम तत्वों की एक jQuery वस्तु बना देगा:

यहाँ एक उदाहरण देखें।

var elements = $('div.find-me'), highest = []; 

elements.each(function(){ 
var parent = this, body = document.body; 

    while(parent && parent.parentNode !== body) { 
    parent = parent.parentNode; 
    } 

    if($.inArray(parent, highest) < 0) { 
    highest.push(parent); 
    } 
}); 

highest = jQuery(highest); 

jsfiddle:

http://jsfiddle.net/D3jC8/2/

Answer 6

"शीर्ष स्तरीय", आप शरीर टैग के एक प्रत्यक्ष वंशज मतलब द्वारा मान लिया जाये, तो आप इस एक लाइनर का उपयोग कर सकते हैं। यह सभी वस्तुओं को .find-me वर्ग के साथ पाता है, फिर माता-पिता को उस टैग के लिए खोजता है जो शरीर टैग के वंशज (जो शीर्ष स्तर होगा)।

$(".find-me").parents("body > *") 

आप इसे यहाँ काम देख सकते हैं:

1. टैग किसी भी प्रकार की शीर्ष स्तर टैग हो सकता है (न सिर्फ एक div)
2. यह: http://jsfiddle.net/jfriend00/9LF6u/

   यह इन फायदे हैं ऐसा करने के तेज़ तरीकों में से एक होना चाहिए क्योंकि इसे .find-me ऑब्जेक्ट्स मिलते हैं (जो getElementsByClassName के माध्यम से अधिकांश ब्राउज़रों में आंतरिक रूप से तेज़ ऑपरेशन होगा) और बस अपने माता-पिता पदानुक्रम को चलाता है।

3. यह स्वचालित रूप से डुप्लिकेट को संभालता है इसलिए दिया गया शीर्ष स्तर आइटम कभी भी एक से अधिक सूचीबद्ध नहीं होगा।
4. यदि कभी भी आप शीर्ष स्तर (एक कंटेनर ऑब्जेक्ट में, उदाहरण के लिए) की परिभाषा को बदलना चाहते हैं, तो आप उस परिवर्तन को प्रतिबिंबित करने के लिए .parents(selector) विधि में पारित चयनकर्ता को बदल सकते हैं।

Answer 7

$(".find-me").map(function() { 
    return $(this).parents("div").last().get(); 
});