Adding Buttons es-419 Explainer

Explicador de Adición de botones

Objetivo de este acertijo: Agregar un botón 'like' debajo de la descripción de cada animal en la página web.

Tutorial de la solución: En este acertijo, usarás el método createElement, el atributo textContent y el método appendChild para agregar un botón debajo de la descripción de cada animal.

Para completar el acertijo, dentro del for…of loop, crea una variable llamada button que almacene un nuevo elemento de botón usando document.createElement('button'). Luego, define su contenido de texto como 'Like'. Por último, anéxalo a body. Asegúrate de que se anexe después de animalName, picture y description. Si no, no va a aparecer en el lugar correcto en la página web.

Conceptos de HTML: <button>
Conceptos de JavaScript: .textContent, .createElement(), document, body, .appendChild()`, for…of loop, import

la solución del código es:

import { animals } from ‘animalShelter.data’;

let title = document.createElement(‘h1’);
title.textContent = ‘Adoptable Animals’;
document.body.appendChild(title);

for (let animal of animals) {

let animalName = document.createElement('h2');
animalName.textContent = animal[0];
document.body.appendChild(animalName);

let picture = document.createElement('img');
picture.src = animal[1];
document.body.appendChild(picture);

let description = document.createElement('p');
description.textContent = animal[2];
document.body.appendChild(description);

}

Esa no es la solución, solo copiaste todo el código de inicio y lo pegaste ahí

Solución Acertijo

import { animals } from ‘animalShelter.data’;

let title = document.createElement (‘h1’);
title.textContent = ‘Adoptable Animals’;
document.body.appendChild(title);

for (let animal of animals) {

let animalName = document.createElement ('h2');
animalName.textContent = animal[0];
document.body.appendChild(animalName);

let picture = document.createElement ('img');
picture.src = animal [1];
document.body.appendChild(picture);

let description = document.createElement ('p');
description.textContent = animal [2];
document.body.appendChild(description);

let button = document.createElement ('button');
button.textContent = 'Like';
document.body.appendChild(button);

}