diff --git a/ejercicios-clase-8.js b/ejercicios-clase-8.js index af39c43..9f2d6da 100644 --- a/ejercicios-clase-8.js +++ b/ejercicios-clase-8.js @@ -1 +1,96 @@ // Vincular este archivo al archivo index.html, y resolver aquí los ejercicios. +//ejercicio 1 +const titulo = document.querySelector("h1"); +function cambiarTitulo(titulo) { +titulo.textContent = "Comidas clásicas/típicas de Argentina"; +return(titulo) +} + +//ejercicio 2 +const item = document.querySelectorAll("ul li"); +for (const i of item) { + console.log(i.textContent); +} + + +function itemLista() { + const item = document.querySelectorAll("ul li"); + for (const i of item) { + i.classList.add("item-lista"); + } +} + +//ejercicio 3 +const lista = document.querySelector("#lista-inicial"); + +function agregarItem(texto) { + const nuevoElemento = document.createElement("li"); + nuevoElemento.textContent = texto; + lista.appendChild(nuevoElemento); +} + +//ejercicio 4 +const parrafos = document.querySelectorAll("#parrafos p"); +parrafos.forEach(p => { + if (p.textContent.includes("importante")) { + p.classList.add("destacado"); + } +}); + +//ejercicio 5; +function nuevoDiv() { + const div = document.createElement("div") + const h2 = document.createElement("h2"); + h2.textContent = "Comidas tipicas de la region del litoral"; + div.appendChild(h2); + const p = document.createElement("p"); + p.textContent = "Algunas de las comidas mas tipicas del litoral pueden ser: "; + div.appendChild(p); + const listaLitoral = document.createElement("ul"); + const item1 = document.createElement("li"); + item1.textContent = "Mbejú"; + listaLitoral.appendChild(item1); + const item2 = document.createElement("li"); + item2.textContent = "Chipa guazu"; + listaLitoral.appendChild(item2); + const item3 = document.createElement("li"); + item3.textContent = "Sopa paraguaya"; + listaLitoral.appendChild(item3); + const item4 = document.createElement("li"); + item4.textContent = "Vori vori"; + listaLitoral.appendChild(item4) + div.appendChild(listaLitoral); + listaLitoral.id = "listaLitoral" + document.body.appendChild(div); +} + +//ejercicio 6 +function limpiarLista(idLista) { + const listaALimpiar = document.querySelectorAll(`#${idLista} li`); + for (const i of listaALimpiar) { + i.remove(); + } +} + +//ejercicio 7 +const imagen = document.querySelector("#foto"); +imagen.setAttribute("src", "foto2.jpg"); +imagen.setAttribute("alt", "Locro"); +console.log(imagen.getAttribute("alt")); + +//ejercicio 8 +function construirLista(arr) { + const div = document.createElement("div"); + div.classList.add("grupo-comidas"); + const titulo = document.createElement("h2"); + titulo.textContent = arr[0]; + div.appendChild(titulo); + const lista = document.createElement("ul"); + for (let i = 1; i < arr.length; i ++) { + const item = document.createElement("li"); + item.textContent = arr[i]; + lista.appendChild(item); + } + div.appendChild(lista); + return div; +} \ No newline at end of file diff --git a/estilo.css b/estilo.css index fcb26fc..c4f3fd7 100644 --- a/estilo.css +++ b/estilo.css @@ -176,3 +176,7 @@ h1 { padding: 20px; } } + +.item-lista { + color: red; +} \ No newline at end of file diff --git a/index.html b/index.html index 0c393ac..657ac68 100644 --- a/index.html +++ b/index.html @@ -31,5 +31,8 @@
¿Y este párrafo? ¿Será importante?
Este es otro párrafo del montón.
+ + +