javascript - 删除按钮上的附加样式表

我刚开始使用JS，但似乎无法弄清楚。

我有一个非常简单的脚本：

function nightmode() {
    var oLink = document.createElement("link")
    oLink.href = "nightmode2.css";
    oLink.rel = "stylesheet";
    oLink.type = "text/css";
    document.body.appendChild(oLink);

和一个按钮：

<button onclick="nightmode()">Night Mode</button>

总而言之，这很好。

但是，我想再次单击以删除样式表。那么，有什么方法可以使nightmode()在第二次运行中反转其自身，然后在第三次运行中正确运行，并在第四次运行中反向运行，依此类推？

谢谢！

最佳答案

您可以通过添加ID并进行检查来切换功能

function nightmode(){
    var el = document.getElementById('myStyles'); // get stylesheet

    if ( el !== null ) {                // if it exists
        el.parentNode.removeChild(el);  // remove it
    } else {                            // if not, add it
        var oLink = document.createElement("link")

        oLink.id   = 'myStyles';
        oLink.href = "nightmode2.css";
        voLink.rel = "stylesheet";
        oLink.type = "text/css";

        document.body.appendChild(oLink);
    }
}