🎯 Reto #3: Contador de clics¶
Reto de nivel principiante
Un contador que persiste en localStorage, con botones para incrementar, decrementar y resetear. Ideal para practicar estado y persistencia.
🎯 Objetivo¶
Crea un contador con:
- Botón +1 y botón -1.
- Botón de reset.
- Persistencia con localStorage.
- Que no baje de 0.
🧠 Conceptos¶
- Variables y estado
- localStorage
- Eventos
🖥️ Editor¶
Solución
```javascript let count = Number(localStorage.getItem('reto3') || 0); const num = document.getElementById('numero'); num.textContent = count;
document.getElementById('mas').addEventListener('click', () => { count++; num.textContent = count; localStorage.setItem('reto3', count); });
document.getElementById('menos').addEventListener('click', () => { if (count > 0) count--; num.textContent = count; localStorage.setItem('reto3', count); });
document.getElementById('reset').addEventListener('click', () => { count = 0; num.textContent = count; localStorage.setItem('reto3', count); }); ```
🚀 Retos extra¶
- [ ] Que el número cambie de color según sea positivo, negativo o cero.
- [ ] Que se pueda escribir un número directamente en un input.
- [ ] Que haya un historial de cambios.