¿es posible ver un elemento html dos veces en la misma página, o debo crear un duplicado?

Question

Estoy creando un sitio que permite ver y editar el contenido de los contenidos 'src-div' dentro de 'edit-div'. No estoy editando src-div directamente, porque está miniaturizado usando la propiedad css zoom.

He considerado usar knockout.js para unir ambos elementos a un observable. Actualmente, he implementado la función con la función jquery .html(): simplemente establezca edit-div innerhtml en src-div innerhtml en 'select', e invierta el proceso después de realizar cambios en edit-div para actualizar src-div.

Me pregunto si realmente necesito 2 divs aquí, o si hay alguna forma de ver realmente el mismo elemento dos veces en una página, y cualquier cambio realizado se reflejará automáticamente en ambas 'vistas', eliminando la necesidad de copiar propiedad innerhtml ida y vuelta entre dos elementos.

esencialmente, esto es como un efecto espejo, sin la tapa.

lo más parecido que encontré hasta ahora es:

http://developer.apple.com/library/safari/#documentation/InternetWeb/Conceptual/SafariVisualEffectsProgGuide/Reflections/Reflections.html

Las prácticas recomendadas para la realización de esta tarea son apreciados.

Answer 1

(Casi) todo lo que ves en una página tiene una contraparte en el DOM. Todo en el DOM se procesa exactamente una vez (aparte de las pseudo-clases). Y cada nodo en el DOM solo puede tener un padre (sin exclusiones).

Desafortunadamente, tendrá que clonar el nodo específico y agregar cambios a ambos, ya que no hay ningún mecanismo de traducción de copia & en la documentación actual de CSS.

Answer 2

Si está utilizando jquery puede usar un div y "clonarlo". Puedes leer esto para más información. http://api.jquery.com/clone/

Si establece la clase del div en la misma cosa, puede hacer que los cambios se propaguen a ambos. Luego puede aplicar .addClass al segundo div para aplicar un efecto "reflejado" (si ese es su objetivo final).