• 1000 опять же, он снова говорит «Переключен в темный режим» и не вернется в светлый режим.
Недавно я перевел свой JS на использование let и const вместо просто var, если это может быть проблемой.
logi c основан на значении currentColor, которое равно getComputedStyle(document.documentElement).getPropertyValue("--mdc-theme-background"); Значение начинается с #fafafa и изменяется на #121212 при включении темного режима и обратно на * 1008. * при повторном переключении в светлый режим.
При включенном темном режиме я даже ввожу getComputedStyle(document.documentElement).getPropertyValue("--mdc-theme-background"); в консоль, и строка, которую он возвращает, действительно #121212, поэтому я не уверен, почему он все еще принимает Маршрут, обозначенный, когда он равен #fafafa. У меня даже есть инструкция else, которая выводит сообщение об ошибке в консоль, но она не идет по этому пути; он всегда идет по маршруту if currentColor === #fafafa || #fafafa.
Вот моя функция:
function toggleDarkMode() {
const currentColor = getComputedStyle(document.documentElement).getPropertyValue("--mdc-theme-background");
// const hrs =
if (currentColor === "#fafafa" || " #fafafa") {
document.documentElement.style.setProperty("--mdc-theme-background", "#121212");
document.documentElement.style.setProperty("--mdc-theme-surface", "#1d1d1d");
document.documentElement.style.setProperty("--mdc-theme-on-surface", "rgba(255,255,255,.87)");
document.documentElement.style.setProperty("--mdc-theme-text-primary-on-light", "rgba(255,255,255,.6)");
console.log("Switched to dark mode.");
} else if (currentColor === "#121212") {
document.documentElement.style.setProperty("--mdc-theme-background", "#fafafa");
document.documentElement.style.setProperty("--mdc-theme-surface", "#fff");
document.documentElement.style.setProperty("--mdc-theme-on-surface", "rgba(0,0,0,0.87)");
document.documentElement.style.setProperty("--mdc-theme-text-primary-on-light", "rgba(0,0,0,.6)");
console.log("Switched to light mode.");
} else {
console.log("Something went wrong with toggling dark mode.");
}
}
Изменить: если я удалю оператор или его часть, он снова заработает. Какое это имеет значение? Пока включен темный режим, currentColor не равен ни #fafafa, ни #fafafa, поэтому утверждение должно быть ложным. Единственная причина, по которой у меня есть оператор или, заключается в том, что значение начинается с пробела перед ним, и я бы предпочел не иметь перед ним пробела, когда я изменяю его в JS.
Редактировать 2: Итак, я удалил условное выражение и изменил его на if currentColor === "#fafafa", и я удалил пробел перед # в моем CSS. Я все равно хотел бы знать, почему это не работает так, как я ожидал, поскольку это меня беспокоит, и я бы предпочел, чтобы функциональность моего кода не зависела от того, есть ли место в моем CSS или нет. Изменено CSS