JQuery, बच्चों और पोते को पुनः प्राप्त

Question

चलो कहते हैं कि मैं एक JQuery वस्तु है जो (करने के लिए अंक या) इस तरह की संरचना करते हैं इस तरह:

['parent', 'child1', 'child2', ..., 'grandchild1', ...] 

धन्यवाद

पी एस कृपया ध्यान दें कि यह इस $ ('div> div') की तरह चयनकर्ता नहीं हो सकता है, क्योंकि मेरे पास पहले से JQuery ऑब्जेक्ट है और केवल इस ऑब्जेक्ट से मुझे सामान लेने की आवश्यकता है।

Answer 1

आप बच्चों और * चयनकर्ता का उपयोग करके पोते प्राप्त कर सकते हैं। आइटम पेड़ के आदेश में वापस आ जाएगा। इसके बाद आप jQuery.toArray() का उपयोग कर तत्वों का एक सादा सरणी प्राप्त कर सकते हैं:

$(function() { 
 
    var a = $("#wrapper").find("*").toArray(); 
 
    console.log(a); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 

 
<div id="wrapper"> 
 
    <div id="parent"> 
 
    <div id="child1"> 
 
     <div id="grandchild1"> 
 
     <div class="level-4"></div> 
 
     <div class="level-4"></div> 
 
     <div class="level-4"></div> 
 
     </div> 
 
    </div> 
 
    <div id="child2"> 
 
     <div class="level-3"></div> 
 
     <div class="level-3"></div> 
 
     <div class="level-3"></div> 
 
     <div class="level-3"> 
 
     <div class="level-4"></div> 
 
     <div class="level-4"></div> 
 
     <div class="level-4"></div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

के बाद एक overkill लेकिन उपयोगी है जब आप पदानुक्रम का उपयोग कर प्रत्यावर्तन पुनरावृत्ति में अधिक रुचि रखते हैं:

function recursiveIterate($node, array) { 
 
    $node.children().each(function() { 
 
    array.push(this); 
 
    recursiveIterate($(this), array); 
 
    }); 
 
} 
 
$(function() { 
 
    var a = []; 
 
    recursiveIterate($("#wrapper"), a); 
 
    console.log(a); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 

 
<div id="wrapper"> 
 
    <div id="parent"> 
 
    <div id="child1"> 
 
     <div id="grandchild1"> 
 
     <div class="level-4"></div> 
 
     <div class="level-4"></div> 
 
     <div class="level-4"></div> 
 
     </div> 
 
    </div> 
 
    <div id="child2"> 
 
     <div class="level-3"></div> 
 
     <div class="level-3"></div> 
 
     <div class="level-3"></div> 
 
     <div class="level-3"> 
 
     <div class="level-4"></div> 
 
     <div class="level-4"></div> 
 
     <div class="level-4"></div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

Answer 2

आप अपनी jQuery ऑब्जेक्ट को ऐरे में बनाने के लिए toArray()^[docs] विधि का उपयोग कर सकते हैं।

var arr = my_obj.toArray(); 

... या get()^[docs] विधि अगर आप इसे पारित नहीं है किसी भी तर्क।

var arr = my_obj.get(); 

---

अगर मैं गलत समझा गया है, और आप जड़ संरचना के की ओर इशारा करते रहे हैं, और उसके वंश को पाने के लिए, find()^[docs] विधि विधि का उपयोग की जरूरत है।

var descendants = my_obj.find('div'); 

---

jQuery has many traversal methods आप किसी दिए गए बिंदु से डोम संरचना के चारों ओर चलते हैं कि।

---

आप केवल बच्चों और पोते, और गहरा कुछ भी नहीं करना चाहता था, तो ऐसा करते हैं:

var two_generations = my_obj.find('> div > div'); 

यह आपको div तत्वों केवल 2 पीढ़ियों गहरी दे देंगे।

आप div तत्वों को सीमित करने के लिए नहीं करना चाहते हैं, ऐसा करते हैं:

var two_generations = my_obj.find('> * > *'); 

Answer 3

अरे आदमी मैं यहाँ बहुत नया हूं और मुझे एक समान मस्तिष्क का झटका था। पोते को पाने के लिए, मैं इसका उपयोग करने का सुझाव देता हूं।बच्चे() दृष्टिकोण:

$('#parent') //selects the parents 
$('#parent').children() //selects the children 
$('#parent').children().children() //selects the grandchildren