Cita:
Iniciado por srwik
Por lo que entiendo ocurre lo siguiente:
1. Se crea una variable llamada caja_monedas que es un querySelector del div con id #coins. Esto se utiliza para modificar dicho div.
2. Se crea un bucle for in donde primero se forma una variable (p) donde se crea el elemento <p>.
3. En el mismo bucle se concatena el <p> con el array mediante un append -> p.append(monedas[index].titulo + " - " + monedas[index].year);
4. Se concatena caja_monedas con el <p>.
1. Lo que se crea ahí es una referencia a un div que ya está añadido al documento. No es "una variable para modificar un div" sino punto de memoria que apunta al div en sí mismo.
2. Mismo error de concepto: no hablamos de variable sino de referencia al elemento párrafo.
Para ser más claro, no es texto sino objeto html. La única diferencia con el html normal es que aún no se añade al documento (al DOM, más precisamente).
3. No se concatena nada porque no es un texto que se pega junto a otro texto. Al elemento párrafo creado en cada iteración del bucle se le define el contenido, es decir, se le añade un nodo de texto que contiene los datos del JSON que se está recorriendo con el for in (título y año).
4. No se concatena: una vez que le pusimos contenido al párrafo, lo agregamos (lo insertamos como nodo html) al documento, pero dentro del elemento div al que hicimos referencia en el punto 1.
Básicamente, creo que estás confundiendo append, que es como appendChild, es decir, un método para agregar nodos html, con innerHTML, que es un método que sí agrega html a partir de un texto con formato html.