Clonación y reemplazo de elementos con cloneNode y replaceChild

Curso de JavaScript: Manipulación del DOM

Entendiendo el DOM

¿Para qué aprender JavaScript?

¿Qué es DOM y Window Object?

Explorando Nodos del DOM

Seleccionando y Accesando a Elementos del DOM

Consultando el DOM con getElementById y querySelector

Navegación efectiva entre nodos

Manipulando Elementos del DOM

Modificando atributos y propiedades

Modificando texto en HTML

Modificando estilos en HTML

Modificando la visibilidad de elementos HTML

Creación de elementos con HTML Strings e insertAdjacentElement()

Agregando elementos con innerHTML e insertAdjacentHTML()

Creación de elementos con createElement()

Remover elementos con remove() y removeChild()

Clonación y reemplazo de elementos con cloneNode y replaceChild

Manipulando Eventos en el DOM

Entendiendo eventos y tipos: Burbuja, Captura y Propagación

Agregar y eliminar escuchadores de eventos o Event Listeners

El objeto evento o eventObject

Manejo de entradas de formulario y validación

Delegación de eventos y prevención de comportamiento predeterminado

Creando un Administrador de Tareas

Añadir tareas desde un formulario

Eliminar y editar tareas del DOM

Almacenamiento y carga de datos en localStorage

Eliminar y editar tareas del almacenamiento local

Inspeccionando y solucionando errores en el código

Personalizando la interfaz del administrador de tareas

Aún hay más por aprender

Asincronía en JavaScript

¿Cómo funciona el JavaScript Engine?

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Si ya tienes una cuenta,

Recursos

Aportes 7

Preguntas 1

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Natalia Gallego Heras

hace 2 meses

Me entró curiosidad de por qué .cloneNode( ) necesitaba el parámetro 'true', quiero decir, ¿y si escribo 'false'? ¿Entonces no se clona? Raro. Pero no, lo que ocurre si el parámetro es 'false' es que no te copia a los hijos del nodo. En la documentación lo llaman "profundidad" (deep) porque es un parámetro que hace referencia a eso, hasta dónde, hasta qué capa llega la clonación. <https://developer.mozilla.org/en-US/docs/Web/API/Node/cloneNode> También avisan que se tenga cuidado porque también se clona el 'id' y el 'id' debe ser único.

Matias Ezequiel Rivero

hace 2 meses

Cuando se crea un ID en HTML de forma automática se guarda un espacio en memoria con ese nombre en JS (siempre y cuando el id no este separado con guiones). Pueden probarlo directamente en consola escribiendo el ID del elemento y les mostrará ese elemento. Por lo que es el caso de contentArea y listArea no haría falta seleccionarlos con querySelector. Podemos hacer directamente: const originalP = contentArea.querySelector("p"); \*En este caso se ve igual porque la variable es igual al ID utilizado en HTML. Pero se ahorran hacer el primer querySelector al contenedor #contentArea y #listArea para el ejemplo de replaceWith();

Victor R Vele

hace un mes

A mi no me mueve el nodo completo alguien me puede recomendar alguna guía por favor

Diego Iván Cundapí León

hace un mes

En este video hay un pequeño error, y es que en el minuto 11:00 pone listArea cuando deberia ser la variable list

Calvin Rafael Bobadilla Fernandez

hace 5 días

![](https://static.platzi.com/media/user_upload/image-a9133b9c-c66a-43ad-bc06-f8203353c816.jpg)

Jesus Anguiano Solano

hace un mes

cloneNode(): Clona el nodo seleccionado. Si se pasa ‘true’ como parámetro, realiza una clonación profunda, copiando todos los elementos y nodos hijos del nodo original. Si se usa ‘false’, solo se clona el nodo sin sus hijos.

Diego Andrés Rojas Pinzón

hace 2 meses

Algo que me llama demasiado la curiosidad es que en un proyecto que hce de manejo de APIS con Js en el curso de MovieDB, a un nodo yo le aplique un addEventListener de scroll o no me acuerdo que tipo era, pero la cuestion es que si elimino ese nodo del DOM sigue estando el evento, me gustaria saber porque sucede eso, si yo lo habia removido, es muy extraño la verdad.