diff --git a/ejercicios-clase-8.js b/ejercicios-clase-8.js index af39c43..d485a2d 100644 --- a/ejercicios-clase-8.js +++ b/ejercicios-clase-8.js @@ -1 +1,51 @@ // Vincular este archivo al archivo index.html, y resolver aquí los ejercicios. + +// Ejercicio 1: Cambiar el título de la página +function cambiarTitulos(nuevoTitulo) { + const titulo = document.querySelector('h1'); + if (titulo){ + titulo.textContent = nuevoTitulo; + console.log(`Titulo cambiado a: ${nuevoTitulo}`); + } else { + console.error('No se encontro el elemento h1 en el documentio.'); + } +} + +// Ejercicio 2:clase item-lista + +function estilizarLista(){ + const items = document.querySelectorAll('li'); + for ( const item of items){ + item.classList.add('item-lista'); + } + console.log(`Se aplico la clase item-lista a ${items.length} elementos`); +} + +// Al invocar la función, vas a notar que los elementos de la lista cambian visualmente (por ejemplo, pueden cambiar de color, tamaño o tipografía). +//¿Por qué pasa esto si solo escribimos JavaScript y no tocamos el diseño? +//Porque en el archivo de estilos (estilos.css o los estilos que ya venían configurados en el repositorio que clonaste del profesor) ya existe una regla armada para la clase .item-lista. + + +// Ejercicio 3: Agregar nuevo item a la lista + +function agregarItem(texto) { + const lista = document.querySelector('#lista-inicial'); + const nuevoItem = document.createElement('li'); + nuevoItem.textContent = texto; + lista.appendChild(nuevoItem); + console.log(`Se agrego el item: ${texto}`); +} + +// Ejercicio 4: parrafo + +function destacarImportante() { + const parrafos = document.querySelectorAll('#parrafos p'); + let contador = 0; + for(const p of parrafos){ + if (p.textContent.includes('importante')){ + p.classList.add('destacado'); + contador++; + } + } + console.log(`Se destacaron ${contador} párrafos.`); +} \ No newline at end of file diff --git a/index.html b/index.html index 0c393ac..47f4131 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.

+ + +