forked from marquez.juan/clase-9-eventos
56 lines
1.3 KiB
JavaScript
56 lines
1.3 KiB
JavaScript
// Agregar acá el código javascript para los ejercicios
|
|
|
|
// Ejercicio 1
|
|
|
|
const clickCounter = document.getElementById('clickCounter');
|
|
const clickButton = document.getElementById('clickButton');
|
|
|
|
let count = 0;
|
|
|
|
clickButton.addEventListener('click', () => {
|
|
count++;
|
|
clickCounter.textContent = count;
|
|
});
|
|
|
|
// Ejercicio 2
|
|
|
|
const textInput = document.getElementById('textInput');
|
|
const charCount = document.getElementById('charCount');
|
|
|
|
textInput.addEventListener('input', () => {
|
|
charCount.textContent = textInput.value.length;
|
|
});
|
|
|
|
// Ejercicio 3
|
|
|
|
const itemList = document.getElementById('itemList');
|
|
|
|
itemList.addEventListener('click', (event) => {
|
|
if (event.target.tagName === 'LI') {
|
|
const items = itemList.querySelectorAll('li');
|
|
items.forEach(item => item.classList.remove('selected'));
|
|
event.target.classList.add('selected');
|
|
}
|
|
});
|
|
|
|
// Ejercicio 4
|
|
|
|
const outside = document.getElementById('outside');
|
|
const inside = document.getElementById('inside');
|
|
const insideButton = document.getElementById('insideButton');
|
|
|
|
outside.addEventListener('click', () => {
|
|
console.log("outside");
|
|
});
|
|
|
|
inside.addEventListener('click', () => {
|
|
console.log("inside");
|
|
})
|
|
|
|
insideButton.addEventListener('click', () => {
|
|
console.log("button");
|
|
});
|
|
|
|
outside.addEventListener('click', () => {
|
|
console.log("outside capturing");
|
|
}, true); |