Come racchiudere un elemento esistente con un altro in jQuery?

Come è possibile creare un che circonda uno esistente <div>.Come racchiudere un elemento esistente con un altro in jQuery?

Il mio codice è il seguente:

<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>

Ma sembra che non possa inserire un <div> senza un tag di chiusura. Quindi come riuscirci?

fonte

2011-12-05 newbie

Si potrebbe desiderare di avvolgere il codice in $ (function() {// code here}); in modo che esegua solo quelli la pagina è completamente caricata –

Ho una lista dinamica con un iteratore. E ho bisogno di inserire 3 articoli per div. :( – newbie

Kyoka, non c'è bisogno di questo come il codice HTML viene prima della sceneggiatura –

Utilizzare il .wrapAll()^doc metodo

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

fonte

2011-12-05 01:29:54

jQuery esegue il wrapping dell'API DOM nativa, che funziona con elementi HTML completi.

Non è possibile inserire metà di un tag.

Invece, è necessario creare un nodo completo creando un oggetto distaccato $('<div />'), aggiungendo più elementi a esso, quindi aggiungendo l'intero albero al DOM.

fonte

2011-12-05 01:23:10 SLaks

ci sia una soluzione alternativa o come posso inserire tre elementi all'interno di un div in modo dinamico? – newbie

Questo non fa nulla per rispondere alla domanda. – riwalk

@ newbie: costruisci l'albero prima di aggiungerlo Vedi la mia modifica – SLaks

È possibile utilizzare la chiamata API .wrap() che avvolgerà l'HTML esistente con un nuovo elemento.

fonte

2011-12-05 01:25:08 Tak

questo avvolgerà ciascuno degli elementi selezionati .. quindi metterà un contenitore diverso attorno a ciascuno degli oggetti .. 'wrapAll' è quello necessario in questo caso .. –

ok, l'uso che:

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

fonte

2011-12-05 01:26:39

Risposta di Tak meglio –

Non hai appena rimosso la tua risposta? –

Questo è ciò che si dovrebbe fare:

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

fonte

2011-12-05 01:34:10 Silkster

Come racchiudere un elemento esistente con un altro in jQuery?

risposta

Problemi correlati