marquez.juan/clase-10-ejercicios-de-repaso
1
0
Fork 7
Code Issues Pull Requests 4 Projects Releases Wiki Activity

Compare commits

base: marquez.juan:main
Branches Tags
marquez.juan:main marquez.juan:solucion-ejercicio-9 marquez.juan:solucion-ejercicio-8 marquez.juan:solucion-ejercicio-7 marquez.juan:solucion-ejercicio-6 marquez.juan:solucion-ejercicio-5 marquez.juan:solucion-ejercicio-4 marquez.juan:solucion-ejercicio-3 marquez.juan:solucion-ejercicio-2 marquez.juan:solucion-ejercicio-1 saucedo.facundo:feat/excersices saucedo.facundo:main
..
compare: saucedo.facundo:feat/excersices
Branches Tags
saucedo.facundo:feat/excersices saucedo.facundo:main marquez.juan:main marquez.juan:solucion-ejercicio-9 marquez.juan:solucion-ejercicio-8 marquez.juan:solucion-ejercicio-7 marquez.juan:solucion-ejercicio-6 marquez.juan:solucion-ejercicio-5 marquez.juan:solucion-ejercicio-4 marquez.juan:solucion-ejercicio-3 marquez.juan:solucion-ejercicio-2 marquez.juan:solucion-ejercicio-1

9 Commits
main ... feat/excer

Author SHA1 Message Date
Facundo Saucedo
e53d194942 feat: implement quiz game functionality with question loading and answer checking 2026-05-25 13:11:34 -03:00
Facundo Saucedo
641cbf7a73 feat: implement product listing and shopping cart functionality 2026-05-25 13:03:03 -03:00
Facundo Saucedo
894fbf39d3 feat: implement user form with validation for username, age, and password 2026-05-25 12:42:12 -03:00
Facundo Saucedo
8000f59a2c feat: add employee table with average salary calculation 2026-05-25 12:36:28 -03:00
Facundo Saucedo
19fbf05d87 feat: implement country search functionality with dynamic results 2026-05-25 12:29:22 -03:00
Facundo Saucedo
4a7c4871f6 feat: implement counter functionality with increment and decrement buttons 2026-05-25 12:22:17 -03:00
Facundo Saucedo
28718fea20 feat: add item list with click event to toggle selection 2026-05-25 12:17:39 -03:00
Facundo Saucedo
927173b159 feat: implement task addition functionality with input validation 2026-05-25 12:14:49 -03:00
Facundo Saucedo
110ed42897 feat: add a greeting button with validation 2026-05-25 12:11:37 -03:00
19 changed files with 367 additions and 9 deletions
Expand all files Collapse all files

9
ejercicio1/ejercicio1.js
View File

@@ -1 +1,10 @@
// Agregar aquí el código javascript // 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}!`;
});

5
ejercicio1/index.html
View File

@@ -8,7 +8,10 @@
</head> </head>
<body> <body>
<h1>Ejercicio 1</h1> <h1>Ejercicio 1</h1>
<label for="name">Nombre:</label>
<input type="text" id="name" name="name">
<button id="greet">Saludar</button>
<p id="greeting"></p>
<script src="ejercicio1.js"></script> <script src="ejercicio1.js"></script>
</body> </body>
</html> </html>

14
ejercicio2/ejercicio2.js
View File

@@ -1 +1,15 @@
// Agregar aquí el código javascript // 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 = '';
});

5
ejercicio2/index.html
View File

@@ -8,7 +8,10 @@
</head> </head>
<body> <body>
<h1>Ejercicio 2</h1> <h1>Ejercicio 2</h1>
<label for="task">Crea una nueva tarea:</label>
<input type="text" id="task" name="task">
<button id="addTask">Agregar tarea</button>
<ul id="taskList"></ul>
<script src="ejercicio2.js"></script> <script src="ejercicio2.js"></script>
</body> </body>
</html> </html>

6
ejercicio3/ejercicio3.js
View File

@@ -1 +1,7 @@
// Agregar aquí el código javascript // Agregar aquí el código javascript
document.getElementById('itemList').addEventListener('click', (event) => {
if (event.target.tagName === 'LI') {
event.target.classList.toggle('selected');
}
});

3
ejercicio3/estilo.css
View File

@@ -1,2 +1,5 @@
/* Agregar el código CSS necesario para el ejercicio */ /* Agregar el código CSS necesario para el ejercicio */
.selected {
background-color: lightblue;
}

9
ejercicio3/index.html
View File

@@ -8,7 +8,14 @@
</head> </head>
<body> <body>
<h1>Ejercicio 3</h1> <h1>Ejercicio 3</h1>
<ul id="itemList">
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
<li>Elemento 5</li>
<li>Elemento 6</li>
</ul>
<script src="ejercicio3.js"></script> <script src="ejercicio3.js"></script>
</body> </body>
</html> </html>

32
ejercicio4/ejercicio4.js
View File

@@ -1 +1,33 @@
// Agregar aquí el código javascript // 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;
});

4
ejercicio4/index.html
View File

@@ -8,7 +8,9 @@
</head> </head>
<body> <body>
<h1>Ejercicio 4</h1> <h1>Ejercicio 4</h1>
<p> Contador: <span id="counter">0</span></p>
<button id="increment">Incrementar</button>
<button id="decrement">Decrementar</button>
<script src="ejercicio4.js"></script> <script src="ejercicio4.js"></script>
</body> </body>
</html> </html>

44
ejercicio5/ejercicio5.js
View File

@@ -1 +1,45 @@
// Agregar aquí el código javascript // 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);
});
});

6
ejercicio5/index.html
View File

@@ -8,7 +8,11 @@
</head> </head>
<body> <body>
<h1>Ejercicio 5</h1> <h1>Ejercicio 5</h1>
<div id="results">
<label for="search">Buscar:</label>
<input type="text" id="search" name="search">
<ul id="resultsList"></ul>
</div>
<script src="ejercicio5.js"></script> <script src="ejercicio5.js"></script>
</body> </body>
</html> </html>

42
ejercicio6/ejercicio6.js
View File

@@ -1 +1,43 @@
// Agregar aquí el código javascript // 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);

2
ejercicio6/index.html
View File

@@ -8,7 +8,9 @@
</head> </head>
<body> <body>
<h1>Ejercicio 6</h1> <h1>Ejercicio 6</h1>
<div id="tableEmployees">
</div>
<script src="ejercicio6.js"></script> <script src="ejercicio6.js"></script>
</body> </body>
</html> </html>

23
ejercicio7/ejercicio7.js
View File

@@ -1 +1,24 @@
// Agregar aquí el código javascript // 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();
});

10
ejercicio7/index.html
View File

@@ -8,7 +8,15 @@
</head> </head>
<body> <body>
<h1>Ejercicio 7</h1> <h1>Ejercicio 7</h1>
<form id="userForm">
<label for="username">Nombre de usuario:</label>
<input type="text" id="username" name="username" required>
<label for="age">Edad:</label>
<input type="number" id="age" name="age" required>
<label for="password">Contraseña:</label>
<input type="password" id="password" name="password" required>
<button type="submit">Enviar</button>
</form>
<script src="ejercicio7.js"></script> <script src="ejercicio7.js"></script>
</body> </body>
</html> </html>

67
ejercicio8/ejercicio8.js
View File

@@ -1 +1,68 @@
// Agregar aquí el código javascript // 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 = '<p>Carrito vacío</p>';
return;
}
let totalPrice = 0;
cart.forEach((quantity, product) => {
const lineTotal = product.price * quantity;
totalPrice += lineTotal;
const itemRow = document.createElement('div');
itemRow.innerHTML = `
<div>${product.name} -------- x${quantity}</div>
<div>$${lineTotal.toLocaleString()}</div>
`;
checkout.appendChild(itemRow);
});
const totalRow = document.createElement('div');
totalRow.innerHTML = `<strong>Total: ------------- $${totalPrice.toLocaleString()}</strong>`;
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();

7
ejercicio8/index.html
View File

@@ -8,7 +8,12 @@
</head> </head>
<body> <body>
<h1>Ejercicio 8</h1> <h1>Ejercicio 8</h1>
<div id="productList">
<!-- Acá se mostrarán los productos -->
</div>
<div id="checkout">
<!-- Acá se mostrará el precio total -->
</div>
<script src="ejercicio8.js"></script> <script src="ejercicio8.js"></script>
</body> </body>
</html> </html>

79
ejercicio9/ejercicio9.js
View File

@@ -1 +1,80 @@
// Agregar aquí el código javascript // 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();

7
ejercicio9/index.html
View File

@@ -8,7 +8,12 @@
</head> </head>
<body> <body>
<h1>Ejercicio 9</h1> <h1>Ejercicio 9</h1>
<div id="quizGame">
<p id="instructions">Responde a la pregunta correcta</p>
<p id="question"></p>
<ul id="options"></ul>
<p id="result"></p>
</div>
<script src="ejercicio9.js"></script> <script src="ejercicio9.js"></script>
</body> </body>
</html> </html>