Estaba tratando de hacer lo mismo con el cuerpo, pero para otras etiquetas como botón, conjunto de campos, etc.
La forma de cambiar la etiqueta del cuerpo para el modo oscuro es "document.body.classList.add("darkmode");" pero necesito saber lo mismo pero para otras etiquetas como las que mencioné antes.
Mi código JS
let darkMode = localStorage.getItem("darkMode"); const enableDarkMode = () => { document.body.classList.add("darkmode"); localStorage.setItem("darkMode", "enable"); } const disableDarkMode = () => { document.body.classList.remove("darkmode"); localStorage.setItem("darkMode", null); } if(darkMode === "enable"){ enableDarkMode() } $("#dark_mode_toggle").click(() => { darkMode = localStorage.getItem("darkMode"); if (darkMode !== "enable"){ enableDarkMode(); }else{ disableDarkMode(); } });La sugerencia de Kinglish en los comentarios parece correcta, después de todo, CSS significa Cascading StyleSheets, pero aquí hay una solución JS para lo que estaba pidiendo.
Como parece que está usando JQuery, puede hacer esto:
$("button").addClass("darkmode");Sin JQuery, puedes hacer esto:
document.querySelectorAll("button").forEach(element => element.classList.add("darkmode"));Para otros elementos, como fieldset, simplemente repita el código que eligió usar desde arriba. Creo que debería ser trivial descubrir cómo deshabilitar el modo oscuro usando el código que ya tienes y esto.