ejercicio7

ejercicios-clase-8.js

@@ -1 +1,78 @@
-// Vincular este archivo al archivo index.html, y resolver aquí los ejercicios.
+//ejercicio1
+let titulo = document.querySelector("h1");
+titulo.textContent = "Comida Rioplatense";
+
+//ejercicio2
+function agregarClaseAItems(etiqueta){ //la funcion debe recibir como parametro la etiqueta html a la cual se le quiere agregar la clase
+array_li = document.querySelectorAll(etiqueta); //lista con los items que tengan dicha etiqueta
+for(let item of array_li){
+    item.classList.add(`item-lista`); //agregamos a cada item la clase "item-lista"
+}};
+
+agregarClaseAItems("li"); //ejecutamos la funcion con la etiqueta HTML como parametro
+
+//ejercicio3
+function agregarItem(contenido){
+    let lista_inicial = document.querySelector("#lista-inicial");   // alojamos la lista en una variable
+    let item_nuevo = document.createElement("li");  // creamos el item
+    item_nuevo.textContent = contenido;     // le otorgamos el contenido del parametro
+    lista_inicial.appendChild(item_nuevo);   // añadimos el item a la lista
+};
+
+agregarItem("Guiso de lentejas");
+agregarItem("Milanesa napolitana");
+agregarItem("Medialunas");
+
+//ejercicio4
+let parrafosImportantes = document.querySelectorAll("#parrafos > p");
+for (let parrafo of parrafosImportantes){
+    if (parrafo.textContent.includes("importante")){
+        parrafo.classList.add("destacado")
+    }
+};
+
+//ejercicio5
+let divComidas = document.querySelector(".grupo-comidas");  //almacenamos en esta variable el div padre al que se anexara todo lo creado a continuacion
+
+let divLitoral = document.createElement("div");   //creamos las etiquetas html para "div" , "ul" , "h2" , "li" y "p"
+let nuevoSubtitulo = document.createElement("h2");
+let parrafoIntroductorio = document.createElement("p") 
+let lista_litoral = document.createElement("ul");  
+let itemUno = document.createElement("li")
+let itemDos = document.createElement("li")
+let itemTres = document.createElement("li")
+
+nuevoSubtitulo.textContent = "comidas del litoral";     // llenamos de texto las etiquetas que van a mostrarlo mediante textcontent
+parrafoIntroductorio.textContent = "La region litoral comprende 6 provincias del centro y noreste argentino, donde gastronomicamente destaca mucho la presencia del pescado de rio y se incorpora a las demas comidas nacionales"
+itemUno.textContent = "Pescados a la parrilla";
+itemDos.textContent = "Empanadas de pescado";
+itemTres.textContent = "Milanesa de merluza";
+
+divComidas.appendChild(divLitoral);     // anexamos los elementos creados previamente a sus respectivas etiquetas "padre"
+divLitoral.appendChild(nuevoSubtitulo); 
+divLitoral.appendChild(parrafoIntroductorio); 
+divLitoral.appendChild(lista_litoral);
+lista_litoral.appendChild(itemUno);
+lista_litoral.appendChild(itemDos);
+lista_litoral.appendChild(itemTres);
+
+//6. Crear una función `limpiarLista` que reciba por parámetro el id de una lista,
+// y que elimine todos los `<li>` de esa lista. Llamarla sobre la lista del
+// ejercicio 2. Pista: `querySelectorAll` + `for...of` + `remove`. Probarla
+// utilizando las devtools, tanto con la lista original de la página como con la
+// lista agregada en el ejercicio anterior.
+
+function limpiarLista (idlista){ 
+    itemsLista = document.querySelectorAll(`#${idlista} > li` );    // hacemos un array con todos los "li" dentro de la lista con el id del parametro 
+    for(li of itemsLista){  // iteramos dentro de la lista y aplicamos el li.remove() a cada "li"
+        li.remove();
+    }
+}
+
+limpiarLista("lista-inicial")
+
+// 7.Escribir el código que cambie el `src` de la imagen a `"foto2.jpg"` y el `alt` a `"Locro"`.
+
+let fotoEmpanadasUno = document.querySelector("#foto");
+fotoEmpanadasUno.setAttribute("src", "foto2.jpg");
+fotoEmpanadasUno.setAttribute("alt", "Locro");

index.html

@@ -31,5 +31,6 @@
             <p>¿Y este párrafo? ¿Será importante?</p>
             <p>Este es otro párrafo del montón.</p>
         </div>
+        <script src="ejercicios-clase-8.js"></script>
     </body>
 </html>