diff --git a/ejercicio1/ejercicio1.js b/ejercicio1/ejercicio1.js index 6ce9e92..2453694 100644 --- a/ejercicio1/ejercicio1.js +++ b/ejercicio1/ejercicio1.js @@ -1 +1,10 @@ // Agregar aquí el código javascript + +document.getElementById('greet').addEventListener('click', () => { + const name = document.getElementById('name').value; + if (name.trim() === '') { + alert('Por favor, ingresa tu nombre.'); + return; + } + document.getElementById('greeting').textContent = `¡Hola, ${name}!`; +}); \ No newline at end of file diff --git a/ejercicio1/index.html b/ejercicio1/index.html index 0a5b7d1..91a6c19 100644 --- a/ejercicio1/index.html +++ b/ejercicio1/index.html @@ -8,7 +8,10 @@

Ejercicio 1

- + + + +

diff --git a/ejercicio2/ejercicio2.js b/ejercicio2/ejercicio2.js index 6ce9e92..57f894a 100644 --- a/ejercicio2/ejercicio2.js +++ b/ejercicio2/ejercicio2.js @@ -1 +1,15 @@ // Agregar aquí el código javascript + +document.getElementById('addTask').addEventListener('click', () => { + const taskInput = document.getElementById('task'); + const task = taskInput.value.trim(); + if (task === '') { + alert('Por favor, ingresa una tarea.'); + return; + } + const taskList = document.getElementById('taskList'); + const li = document.createElement('li'); + li.textContent = task; + taskList.appendChild(li); + taskInput.value = ''; +}); \ No newline at end of file diff --git a/ejercicio2/index.html b/ejercicio2/index.html index a6d71cf..0c5cb4d 100644 --- a/ejercicio2/index.html +++ b/ejercicio2/index.html @@ -8,7 +8,10 @@

Ejercicio 2

- + + + + diff --git a/ejercicio3/ejercicio3.js b/ejercicio3/ejercicio3.js index 6ce9e92..9e6e908 100644 --- a/ejercicio3/ejercicio3.js +++ b/ejercicio3/ejercicio3.js @@ -1 +1,7 @@ // Agregar aquí el código javascript + +document.getElementById('itemList').addEventListener('click', (event) => { + if (event.target.tagName === 'LI') { + event.target.classList.toggle('selected'); + } +}); \ No newline at end of file diff --git a/ejercicio3/estilo.css b/ejercicio3/estilo.css index 159b7f6..492839e 100644 --- a/ejercicio3/estilo.css +++ b/ejercicio3/estilo.css @@ -1,2 +1,5 @@ /* Agregar el código CSS necesario para el ejercicio */ +.selected { + background-color: lightblue; +} \ No newline at end of file diff --git a/ejercicio3/index.html b/ejercicio3/index.html index 678d7ee..bee57d5 100644 --- a/ejercicio3/index.html +++ b/ejercicio3/index.html @@ -8,7 +8,14 @@

Ejercicio 3

- + diff --git a/ejercicio4/ejercicio4.js b/ejercicio4/ejercicio4.js index 6ce9e92..09e5452 100644 --- a/ejercicio4/ejercicio4.js +++ b/ejercicio4/ejercicio4.js @@ -1 +1,33 @@ // Agregar aquí el código javascript + +const incrementButton = document.getElementById('increment'); +const decrementButton = document.getElementById('decrement'); +const counterDisplay = document.getElementById('counter'); + +let counter = 0; + +incrementButton.addEventListener('click', () => { + if (counter >= 10) { + incrementButton.disabled = true; + alert('El contador ha alcanzado el valor máximo de 10.'); + return; + } + counter++; + if (counter > 0) { + decrementButton.disabled = false; + } + counterDisplay.textContent = counter; +}); + +decrementButton.addEventListener('click', () => { + if (counter <= 0) { + decrementButton.disabled = true; + alert('El contador ha alcanzado el valor mínimo de 0.'); + return; + } + counter--; + if (counter < 10) { + incrementButton.disabled = false; + } + counterDisplay.textContent = counter; +}); \ No newline at end of file diff --git a/ejercicio4/index.html b/ejercicio4/index.html index f7e70b1..ef48645 100644 --- a/ejercicio4/index.html +++ b/ejercicio4/index.html @@ -8,7 +8,9 @@

Ejercicio 4

- +

Contador: 0

+ + diff --git a/ejercicio5/ejercicio5.js b/ejercicio5/ejercicio5.js index 6ce9e92..e4ebf64 100644 --- a/ejercicio5/ejercicio5.js +++ b/ejercicio5/ejercicio5.js @@ -1 +1,45 @@ // Agregar aquí el código javascript + +const countries = [ + 'Argentina', + 'Brasil', + 'Chile', + 'Colombia', + 'Ecuador', + 'Perú', + 'Uruguay', + 'Venezuela', + 'Paraguay', + 'Bolivia', + 'Panamá', + 'Costa Rica', + 'Cuba', + 'República Dominicana', + 'Guatemala', + 'Honduras', + 'El Salvador', + 'Nicaragua', + 'Puerto Rico', + 'México', + 'Estados Unidos', + 'Canadá', + 'Guayana', + 'Surinam', + 'Guyana Francesa', +]; + +document.getElementById('search').addEventListener('input', () => { + const query = document.getElementById('search').value.toLowerCase(); + const resultsList = document.getElementById('resultsList'); + resultsList.innerHTML = ''; + + const filteredCountries = countries.filter(country => + country.toLowerCase().includes(query) + ); + + filteredCountries.forEach(country => { + const li = document.createElement('li'); + li.textContent = country; + resultsList.appendChild(li); + }); +}); \ No newline at end of file diff --git a/ejercicio5/index.html b/ejercicio5/index.html index 51c5f8b..16962be 100644 --- a/ejercicio5/index.html +++ b/ejercicio5/index.html @@ -8,7 +8,11 @@

Ejercicio 5

- +
+ + + +
diff --git a/ejercicio6/ejercicio6.js b/ejercicio6/ejercicio6.js index 6ce9e92..646d443 100644 --- a/ejercicio6/ejercicio6.js +++ b/ejercicio6/ejercicio6.js @@ -1 +1,43 @@ // Agregar aquí el código javascript +const employees = [ + { name: "Ana", sector: "Desarrollo", salary: 150000 }, + { name: "Luis", sector: "Diseño", salary: 120000 }, + { name: "Marta", sector: "Desarrollo", salary: 160000 }, + { name: "Carlos", sector: "RRHH", salary: 110000 }, + { name: "Julia", sector: "Diseño", salary: 130000 } +]; + +const tableContainer = document.getElementById('tableEmployees'); + +const table = document.createElement('table'); +const headerRow = document.createElement('tr'); + +['Nombre', 'Sector', 'Salario'].forEach(headerText => { + const th = document.createElement('th'); + th.textContent = headerText; + headerRow.appendChild(th); +}); +table.appendChild(headerRow); +tableContainer.appendChild(table); + +employees.forEach(employee => { + const row = document.createElement('tr'); + ['name', 'sector', 'salary'].forEach(key => { + const td = document.createElement('td'); + td.textContent = employee[key]; + row.appendChild(td); + }); + table.appendChild(row); +}); + +table.appendChild(document.createElement('tr')); // Fila vacía para separación + +const averageSalary = employees.reduce((sum, emp) => sum + emp.salary, 0) / employees.length; +const averageRow = document.createElement('tr'); +const averageLabelCell = document.createElement('td'); +averageLabelCell.textContent = 'Salario Promedio'; +averageRow.appendChild(averageLabelCell); +const averageValueCell = document.createElement('td'); +averageValueCell.textContent = averageSalary; +averageRow.appendChild(averageValueCell); +table.appendChild(averageRow); diff --git a/ejercicio6/index.html b/ejercicio6/index.html index ea1f061..4323639 100644 --- a/ejercicio6/index.html +++ b/ejercicio6/index.html @@ -8,7 +8,9 @@

Ejercicio 6

- +
+ +
diff --git a/ejercicio7/ejercicio7.js b/ejercicio7/ejercicio7.js index 6ce9e92..f2149f9 100644 --- a/ejercicio7/ejercicio7.js +++ b/ejercicio7/ejercicio7.js @@ -1 +1,24 @@ // Agregar aquí el código javascript + +const userForm = document.getElementById('userForm'); + +userForm.addEventListener('submit', (event) => { + event.preventDefault(); + const username = document.getElementById('username').value.trim(); + const age = parseInt(document.getElementById('age').value); + const password = document.getElementById('password').value; + if (username === '') { + alert('El nombre de usuario no puede estar vacío.'); + return; + } + if (isNaN(age) || age < 0 || age > 100) { + alert('La edad debe ser un número válido entre 0 y 100.'); + return; + } + if (password.length < 8) { + alert('La contraseña debe tener al menos 8 caracteres.'); + return; + } + alert('Formulario enviado correctamente.'); + userForm.reset(); +}); \ No newline at end of file diff --git a/ejercicio7/index.html b/ejercicio7/index.html index 205939a..86d1eda 100644 --- a/ejercicio7/index.html +++ b/ejercicio7/index.html @@ -8,7 +8,15 @@

Ejercicio 7

- +
+ + + + + + + +
diff --git a/ejercicio8/ejercicio8.js b/ejercicio8/ejercicio8.js index 6ce9e92..73f1cce 100644 --- a/ejercicio8/ejercicio8.js +++ b/ejercicio8/ejercicio8.js @@ -1 +1,68 @@ // Agregar aquí el código javascript + +const products = [ + { name: "Teclado", price: 8500 }, + { name: "Mouse", price: 4200 }, + { name: "Monitor", price: 62000 }, + { name: "Auriculares", price: 11000 }, + { name: "Webcam", price: 15500 } +]; + +const productList = document.getElementById('productList'); +const checkout = document.getElementById('checkout'); + +products.forEach(product => { + const productDiv = document.createElement('div'); + productDiv.textContent = `${product.name} - $${product.price} `; + const buyButton = document.createElement('button'); + buyButton.textContent = 'Comprar'; + productDiv.appendChild(buyButton); + productList.appendChild(productDiv); +}); + +const cart = new Map(); + +const renderCart = () => { + checkout.innerHTML = ''; + + if (cart.size === 0) { + checkout.innerHTML = '

Carrito vacío

'; + return; + } + + let totalPrice = 0; + + cart.forEach((quantity, product) => { + const lineTotal = product.price * quantity; + totalPrice += lineTotal; + + const itemRow = document.createElement('div'); + itemRow.innerHTML = ` +
${product.name} -------- x${quantity}
+
$${lineTotal.toLocaleString()}
+ `; + checkout.appendChild(itemRow); + }); + + const totalRow = document.createElement('div'); + totalRow.innerHTML = `Total: ------------- $${totalPrice.toLocaleString()}`; + checkout.appendChild(totalRow); +}; + +productList.addEventListener('click', (event) => { + if (event.target.tagName === 'BUTTON') { + const productDiv = event.target.parentElement; + const productName = productDiv.textContent.split(' - ')[0]; + const product = products.find(p => p.name === productName); + + if (!product) { + return; + } + + const currentQty = cart.get(product) || 0; + cart.set(product, currentQty + 1); + renderCart(); + } +}); + +renderCart(); \ No newline at end of file diff --git a/ejercicio8/index.html b/ejercicio8/index.html index ec3d268..0234a07 100644 --- a/ejercicio8/index.html +++ b/ejercicio8/index.html @@ -8,7 +8,12 @@

Ejercicio 8

- +
+ +
+
+ +
diff --git a/ejercicio9/ejercicio9.js b/ejercicio9/ejercicio9.js index 6ce9e92..f354439 100644 --- a/ejercicio9/ejercicio9.js +++ b/ejercicio9/ejercicio9.js @@ -1 +1,80 @@ // Agregar aquí el código javascript + +const questions = [ + { + question: "¿Cuál es la capital de Francia?", + options: ["Londres", "Berlín", "París", "Roma"], + correctAnswer: 2 + }, + { + question: "¿Cuál es el río más largo del mundo?", + options: ["Nilo", "Amazonas", "Yangtsé", "Misisipi"], + correctAnswer: 1 + }, + { + question: "¿Quién escribió 'Cien años de soledad'?", + options: ["Gabriel García Márquez", "Mario Vargas Llosa", "Isabel Allende", "Jorge Luis Borges"], + correctAnswer: 0 + }, + { + question: "¿Cuál es el planeta más grande del sistema solar?", + options: ["Júpiter", "Saturno", "Urano", "Neptuno"], + correctAnswer: 0 + }, + { + question: "¿En qué año se descubrió América?", + options: ["1492", "1500", "1485", "1510"], + correctAnswer: 0 + } +]; + +let currentQuestionIndex = 0; +let score = 0; + +const questionElement = document.getElementById('question'); +const optionsElement = document.getElementById('options'); +const resultElement = document.getElementById('result'); + +const loadQuestion = () => { + const currentQuestion = questions[currentQuestionIndex]; + questionElement.textContent = currentQuestion.question; + optionsElement.innerHTML = ''; + currentQuestion.options.forEach((option, index) => { + const li = document.createElement('li'); + const button = document.createElement('button'); + button.textContent = option; + li.appendChild(button); + button.addEventListener('click', () => checkAnswer(index)); + optionsElement.appendChild(li); + }); +}; + +const checkAnswer = (selectedIndex) => { + const currentQuestion = questions[currentQuestionIndex]; + if (selectedIndex === currentQuestion.correctAnswer) { + resultElement.textContent = "¡Correcto!"; + score++; + currentQuestionIndex++; + if (currentQuestionIndex < questions.length) { + setTimeout(() => { + resultElement.textContent = ''; + loadQuestion(); + }, 1000); + } else { + resultElement.textContent = `¡Juego terminado! Tu puntuación es ${score}/${questions.length}.`; + } + } else { + resultElement.textContent = "Incorrecto. La respuesta correcta es: " + currentQuestion.options[currentQuestion.correctAnswer]; + currentQuestionIndex++; + if (currentQuestionIndex < questions.length) { + setTimeout(() => { + resultElement.textContent = ''; + loadQuestion(); + }, 2000); + } else { + resultElement.textContent = `¡Juego terminado! Tu puntuación es ${score}/${questions.length}.`; + } + } +}; + +loadQuestion(); \ No newline at end of file diff --git a/ejercicio9/index.html b/ejercicio9/index.html index 2d407da..979701a 100644 --- a/ejercicio9/index.html +++ b/ejercicio9/index.html @@ -8,7 +8,12 @@

Ejercicio 9

- +
+

Responde a la pregunta correcta

+

+ +

+