时间戳

首页 > 解决方案 > 如何在两个 CSS 文档之间切换

javascript - 如何在两个 CSS 文档之间切换

问题描述

我正在尝试在我的网页上使用深色主题和浅色主题，但我找不到仅使用一个按钮来切换它们的方法（因此第一次单击按钮会打开深色主题，第二次将其关闭） . 我希望能够在不使用第三方 JavaScript 库的情况下做到这一点。我找到了一种使用<option>元素的方法，但这不是我想要的“切换按钮”：

  <button onclick=getTheme() id=themeToggle>Click to use this theme.</button>
    <select id="select">
        <option>Dark Theme</option>
        <option>Revert To Original</option>
    </select>

和

function getTheme () {
    function changeTheme (Theme) {
        document.getElementById('style').setAttribute('href', Theme);
    }
    var index = document.getElementById("select").selectedIndex;
    switch (index) {
        case 0:
          changeTheme('css/dark.css');
          break;
          case 1: changeTheme('css/main.css');
    }
}

谢谢你的帮助！

标签： javascripthtmlcss

解决方案

我知道这看起来有点业余，但你可以做这样的事情，

<button onclick=getTheme() id=themeToggle>Click to use this theme.</button>
<script>
var click = 0;
function getTheme()
{   
    click++;
    if(click%2 == 0)
        changeTheme('css/dark.css');
    else
        changeTheme('css/main.css');
}
</script>

并相应地更改按钮上的文本。让我知道它是否有效。

推荐阅读