jQuery anexar DOM

Question

Todos los ejemplos de jQuery.append() parecen tomar una cadena html y anexarla a un contenedor. Tengo un caso de uso ligeramente diferente. Mi servidor me devuelve un XML que contiene el texto HTML que se mostrará, algo así como:

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

tengo un div donde este contenido necesita ser mostrada.

Mi JS hace actualmente los siguientes:

1. cargas de los datos XML en jQuery en la .ajax $() manejador de éxito:

   var JData = $ (datos);

2. encontrar la etiqueta de contenido y trata de añadir a sus hijos a la div que se supone para mostrar el evento:

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

El modo de adición() llamada falla con error no detectada: WRONG_DOCUMENT_ERR: DOM Excepción 4 en Chrome. El depurador muestra el valor a ser un objeto DOM Element y $ (valor) para ser un Objeto que contiene el Elemento.

Cualquier ayuda será apreciada.

Gracias. -Raj

Answer 1

No se pueden agregar nodos que pertenecen a un árbol DOM a otro documento.

Trate de clone ellos:

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

o simplemente utilizar su representación textual de tenerlos recrearon:

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