diff --git a/ejercicios-clase-8.js b/ejercicios-clase-8.js index af39c43..797138a 100644 --- a/ejercicios-clase-8.js +++ b/ejercicios-clase-8.js @@ -1 +1,141 @@ // Vincular este archivo al archivo index.html, y resolver aquí los ejercicios. + +console.log("JS conectado"); + +// 1 +function cambiarTitulo() { + const titulo = document.querySelector("h1"); + + titulo.textContent = "Nuevo título desde JavaScript"; +} +// 2 + +function destacarComidas() { + const comidas = document.querySelectorAll("li"); + + for (const comida of comidas) { + comida.style.color = "red"; + } +} +// 3 + +function agregarItem(texto) { + const lista = document.querySelector("#lista-inicial"); + + const nuevoItem = document.createElement("li"); + + nuevoItem.textContent = texto; + + lista.appendChild(nuevoItem); +} +// 4 + +function destacarParrafos() { + const parrafos = document.querySelectorAll("#parrafos p"); + + for (const parrafo of parrafos) { + if (parrafo.textContent.includes("importante")) { + parrafo.classList.add("destacado"); + } + } +} +// 5 + +function agregarComidasLitoral() { + const div = document.createElement("div"); + + const titulo = document.createElement("h2"); + titulo.textContent = "Comidas típicas del litoral"; + + const parrafo = document.createElement("p"); + parrafo.textContent = "Algunas comidas tradicionales del litoral argentino."; + + const lista = document.createElement("ul"); + + const comidas = ["Chipá", "Surubí", "Pacú"]; + + for (const comida of comidas) { + const item = document.createElement("li"); + + item.textContent = comida; + + lista.appendChild(item); + } + + div.appendChild(titulo); + div.appendChild(parrafo); + div.appendChild(lista); + + document.body.appendChild(div); +}// Ejercicio 5 + +function agregarComidasLitoral() { + const div = document.createElement("div"); + + const titulo = document.createElement("h2"); + titulo.textContent = "Comidas típicas del litoral"; + + const parrafo = document.createElement("p"); + parrafo.textContent = "Algunas comidas tradicionales del litoral argentino."; + + const lista = document.createElement("ul"); + + const comidas = ["Chipá", "Surubí", "Pacú"]; + + for (const comida of comidas) { + const item = document.createElement("li"); + + item.textContent = comida; + + lista.appendChild(item); + } + + div.appendChild(titulo); + div.appendChild(parrafo); + div.appendChild(lista); + + document.body.appendChild(div); +} +// 6 + +function limpiarLista(idLista) { + const items = document.querySelectorAll(`#${idLista} li`); + + for (const item of items) { + item.remove(); + } +} +// 7 + +function cambiarImagen() { + const imagen = document.querySelector("#foto"); + + imagen.setAttribute("src", "foto2.jpg"); + + imagen.setAttribute("alt", "Locro"); +} +// 8 + +function construirLista(datos) { + const div = document.createElement("div"); + + div.classList.add("grupo-comidas"); + + const titulo = document.createElement("h2"); + titulo.textContent = datos[0]; + + const lista = document.createElement("ul"); + + for (let i = 1; i < datos.length; i++) { + const item = document.createElement("li"); + + item.textContent = datos[i]; + + lista.appendChild(item); + } + + div.appendChild(titulo); + div.appendChild(lista); + + return div; +} \ No newline at end of file diff --git a/estilo.css b/estilo.css index fcb26fc..e2df1cb 100644 --- a/estilo.css +++ b/estilo.css @@ -8,6 +8,8 @@ * { box-sizing: border-box; } +.item-lista { + color:red;} body { margin: 0; diff --git a/index.html b/index.html index 0c393ac..64e23af 100644 --- a/index.html +++ b/index.html @@ -31,5 +31,6 @@
¿Y este párrafo? ¿Será importante?
Este es otro párrafo del montón.
+