Показать сообщение отдельно
  #20 (permalink)  
Старый 11.05.2022, 12:28
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

vitalso78,
<!DOCTYPE html>
<html>
<head>
    <title>css localStorage</title>
    <meta charset="UTF-8" />
    <base href="https://delivery.foodsonic.ru/" />
    <link rel="stylesheet" href="https://delivery.foodsonic.ru/dark.css" id="theme-css-file" />
    <script>
        document.addEventListener("DOMContentLoaded", function() {

            const styleElement = document.querySelector("#theme-css-file");
            const button = document.querySelector("#SuperButton");
            let CssFilePath = localStorage.getItem("CssFilePath");
            if (CssFilePath) styleElement.href = CssFilePath;
                button.addEventListener("click", function() {
                    let href = "https://delivery.foodsonic.ru/light.css";
                    button.classList.toggle("switch-on");
                    if(button.classList.contains("switch-on")) href = "https://delivery.foodsonic.ru/dark.css";
                    styleElement.href = href;
                    localStorage.setItem("CssFilePath", href);
                })
        });
    </script>
</head>
<body>
    <div>Switch theme:</div>
    <div class="switch-btn switch-on" id="SuperButton" name="SuperButton">click me SuperButton</div>

</body>
</html>
Ответить с цитированием