Ejercicio de programación con HTML: Reto LocalStorage en HTML
Código
0h 5m
Aprende a usar LocalStorage en HTML para guardar y recordar el color favorito del usuario con JavaScript. Ejercicio práctico y didáctico.
Crea una página HTML que permita al usuario seleccionar su color favorito mediante un selector y lo guarde en LocalStorage. La página debe recordar la elección del usuario incluso después de cerrar y volver a abrir el navegador.
Para resolver este ejercicio:
- Crea un selector (elemento ) con al menos 3 opciones de colores diferentes Implementa una función JavaScript que guarde la selección del usuario en LocalStorage cuando cambie el valor del selector Al cargar la página, verifica si existe una preferencia guardada en LocalStorage y, en caso afirmativo, establece el selector en ese valor Añade un botón para borrar la preferencia guardada (usando removeItem) Aplica el color seleccionado como color de fondo de la página para mostrar visualmente la preferencia Asegúrate de manejar correctamente los casos donde LocalStorage no esté disponible.
Todos los ejercicios de programación de HTML
Evalúa tus conocimientos con ejercicios de programación en HTML de tipo Test, Puzzle, Código y Proyecto con VSCode.
Reto etiquetas semánticas HTML
Código
Divisiones
Test
Audio
Puzzle
Proyecto crear páginas HTML
Proyecto
Enlace
Puzzle
Video
Puzzle
Imágenes
Test
Reto atributos ARIA en HTML
Código
DOCTYPE
Test
Compatibilidad con navegadores
Test
Reto trabajar con imágenes en HTML
Código
Reto crear tablas HTML
Código
Introducción a HTML
Test
Imágenes vectoriales
Test
Anidación de etiquetas
Test
Formularios
Puzzle
Encabezados
Puzzle
Reto Validación HTML
Código
Optimización de la carga de la página (Lazy loading)
Puzzle
Listas
Puzzle
Reto metadatos en HTML
Código
Estilos
Puzzle
Validación de HTML
Puzzle
Navegación por teclado
Puzzle
Párrafos
Test
Uso de DOCTYPE
Puzzle
Reto de enlaces HTML
Código
Etiquetas semánticas
Puzzle
Contraste y legibilidad
Test
Atributos de ARIA
Test
Reto geolocalización en HTML
Código
Tablas
Test
Uso de atributos
Puzzle
Atributos
Test
Reto formatear texto en HTML
Código
Reto crear listas HTML
Código
Metadatos
Test
Comentarios
Test
Incrustación de contenido (iframe)
Test
Uso de elementos y etiquetas
Puzzle
Elementos y etiquetas
Test
Tutorial para resolver este ejercicio de programación
HTML
Local Storage y Session Storage
APIs de HTML5