किसी मौजूदा तत्व को jQuery में किसी अन्य के साथ कैसे लपेटें?

Question

मैं मौजूदा <div> के आस-पास <div> कैसे बना सकता हूं।

<div id="test"> 
    <h2>Greetings</h2> 
    <p>Test</p> 
    <div class="inner">Hello</div> 
    <p>Test</p> 
    <div class="inner">Goodbye</div> 
</div> 
<div id="test2"> 
    <h2>Greetings</h2> 
    <p>Test</p> 
    <div class="inner">Hello</div> 
    <p>Test</p> 
    <div class="inner">Goodbye</div> 
</div> 

<script> 
    $("#test").before('<div class="test3">'); 
    $("#test2").after('</div>'); 
</script> 

लेकिन यह है कि यह एक अंत टैग के बिना एक <div> सम्मिलित नहीं कर सकते लगता है:

मेरे कोड इस प्रकार है। तो उसे कैसे प्राप्त करें?

Answer 1

.wrapAll()^doc विधि

$('#test, #test2').wrapAll('<div class="test3">'); 

Answer 2

jQuery देशी डीओएम एपीआई लपेटता है, जो पूर्ण HTML तत्वों के साथ काम करता है।

आप टैग के आधे भाग को सम्मिलित नहीं कर सकते हैं।

इसके बजाय, आपको अलग-अलग $('<div />') बनाकर एक पूर्ण नोड बनाना चाहिए, इसमें कई तत्व जोड़ना, फिर पूरे पेड़ को डोम में जोड़ना चाहिए।

Answer 3

आप .wrap() एपीआई कॉल का उपयोग कर सकते हैं जो मौजूदा HTML को एक नए तत्व के साथ लपेट देगा।

Answer 4

ठीक है, कि का उपयोग करें:

<script> 
     var inner=$("#test"); 
     var outer=$('<div class="outer"></div>'); 
     outer.html(inner.html()); 
     inner=outer; 
</script> 

Answer 5

इस का प्रयोग करें आपको क्या करना चाहिए है:

<script type="text/javascript"> 
$(function() { 
    $('<div class="test3"></div>') 
     .insertBefore($('#test')) 
     .append($('#test')) 
     .append($("#test2")); 
} 
</script>