estaba en mayúscula al utilizar contentArea.innerHTML, no ocurrió nada malo ni se rompió. Eso es porque HTML (en general) es insensible a las mayúsculas y minúsculas.
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,
Creación de elementos con HTML Strings e insertAdjacentElement()
10/27Recursos
Aportes 5
Preguntas 1
Ordenar por:
Cuando la etiqueta de apertura de párrafo \
como me gusta hacerme la vida complicada pense "pero creo que si uso BEM para el css igual y sera mas facil tener todo organizado por clases en el html, ya saben un nombre de clase para cada bloque, entonces me combiene intentar llamar usando el class name a ver que" obviamente no funciono, despues de revisar un poco el codigo y que verificara que efectivamente el "error" era por ese cambio de id a classname, le hice la pregunta adecuada a chat gpt y me dio la respuesta adecuada: • Selecciona todos los elementos que tienen la clase especificada.
• Retorna una colección HTML (un array-like) de elementos.
• Como retorna múltiples elementos, necesitas iterar sobre la colección para modificar el `innerHTML` de cada uno.
¿alguno tiene sugerencias para que el codigo sea escalable apesar de esto,? es decir que pasa si con el tiempo (aunque no se que tan posible sea) estas colecciones se hacen mas y mas numerosas, como iterar para que esto no sea un problema a la hora de insertar siempre en el mismo punto el texto.....? bueno tal vez deberia ver el resto de la clase :v
Cuando he hecho proyectos de frontend y he usado estas propiedades siempre me ha resultado mejor usar template strings en vez de comillas simples o dobles, ya que son multilínea y no hace falta concatenar, además con las comillas normales hay veces que hay usar caracteres de escape con una barra invertida, con los template strings nos ahorramos todo eso y es mas legible.
innerHTML -> reemplaza todo lo que hay en el elemento por lo que asignemos.
insertAdjacentHTML -> agrega el contenido en cualquiera de las posiciones declaradas disponibles.
\*Ambos casos el valor es en formato string con el formato de etiqueta de HTML -> "\
Nuevo Elemento\
"
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?