jQuery append DOM

Question

Tutti gli esempi di jQuery.append() sembrano prendere una stringa html e aggiungerla ad un contenitore. Ho un caso d'uso leggermente diverso. Il mio server mi restituisce un XML che contiene testo HTML da visualizzare, qualcosa di simile:

<event source="foo"> 
    <contents> 
     <h1>This is an event</h1> 
     This is the body of the event 
    </contents> 
</event> 

Ho un div in cui questo contenuto deve essere visualizzato.

mio JS attualmente esegue le seguenti operazioni:

1. Carichi il backup dei dati XML in jQuery nel gestore $ .ajax() successo:

   var jdata = $ (dati);

2. trovare il tag contenuti e tenta di aggiungere i propri figli al div che si suppone per visualizzare l'evento:

   var contents = jData.find("contents"); 
   if(contents != null) 
   { 
       $(contents).children().each(function(index, value) 
       { 
       $("#eventDiv").append($(value)); 
       }); 
   } 
   

La chiamata append() non riesce con Uncaught Errore: WRONG_DOCUMENT_ERR: DOM Eccezione 4 su Chrome. Il debugger mostra valore come oggetto DOM Element e $ (valore) per essere un oggetto che contiene l'elemento .

Qualsiasi aiuto sarà apprezzato.

Grazie. -Raj

Answer 1

Non è possibile aggiungere nodi appartenenti a un albero DOM ad un altro documento.

Provate a loro clone:

$("#eventDiv").append(jData.find("contents").children().clone()); 

o semplicemente usare il loro rappresentazione testuale di avere ri-creato:

$("#eventDiv").append(jData.find("contents").html());