Quiero crear un sistema simple de modo claro/oscuro con javascript. Funciona configurando el booleano 'darkTheme' en Window.localStorage Aquí está el código que escribí:
let lightThemeCheckbox = document.getElementById('lightThemeCheckbox'); let body = document.body; updateLightTheme(); lightThemeCheckbox.addEventListener('change', function() { Window.localStorage.setItem('darkTheme', this.checked); }); function updateLightTheme() { let darkTheme = window.localStorage.getItem('darkTheme'); if(darkTheme == undefined) { body.style.backgroundColor = 'rgb(255, 255, 255)'; return; } body.style.backgroundColor = darkTheme ? 'rgb(100, 100, 100)' : 'rgb(255, 255, 255)'; }Pero por alguna razón, me sale este error:
Uncaught TypeError: Cannot read properties of undefined (reading 'setItem') at HTMLInputElement.<anonymous> (header.js:7) (anonymous) @ header.js:7¿Alguien puede ayudar?
Has puesto "ventana" con w mayúscula. Puedes usar lo siguiente:
window minúsculas const lightThemeCheckbox = document.getElementById('lightThemeCheckbox'); const body = document.body; updateLightTheme(); lightThemeCheckbox.addEventListener('change', () => { window.localStorage.setItem('darkTheme', this.checked); }); function updateLightTheme() { const darkTheme = window.localStorage.getItem('darkTheme'); if (darkTheme == undefined) { body.style.backgroundColor = 'rgb(255, 255, 255)'; return; } body.style.backgroundColor = darkTheme ? 'rgb(100, 100, 100)' : 'rgb(255, 255, 255)'; }localStorage sin window const lightThemeCheckbox = document.getElementById('lightThemeCheckbox'); const body = document.body; updateLightTheme(); lightThemeCheckbox.addEventListener('change', () => { localStorage.setItem('darkTheme', this.checked); }); function updateLightTheme() { const darkTheme = localStorage.getItem('darkTheme'); if (darkTheme == undefined) { body.style.backgroundColor = 'rgb(255, 255, 255)'; return; } body.style.backgroundColor = darkTheme ? 'rgb(100, 100, 100)' : 'rgb(255, 255, 255)'; }¡Esperaba que esto ayudara!