更改样式表 javascript答案

【问题标题】：Changing Style Sheet javascript更改样式表 javascript
【发布时间】：2013-01-12 11:43:01
【问题描述】：

我得到了这个 HTML 代码：

<head>
    <script type="application/javascript" src="javascript.js">
    <link id="pagestyle" href="default.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <button id="stylesheet1" > Default Style Sheet </button>
    <button id="stylesheet2" > Dark Style Sheet </button>
</body>

在 javascript.js 中我得到了这个：

function swapStyleSheet(sheet) {
    document.getElementById("pagestyle").setAttribute("href", sheet);  
}

function initate() {
    var style1 = document.getElementById("stylesheet1");
    var style2 = document.getElementById("stylesheet2");

    style1.onclick = swapStyleSheet("default".css);
    style2.onclick = swapStyleSheet("dark".css);
}

window.onload = initate;

我想在按下此按钮时更改样式表。我不知道为什么它不起作用。

【问题讨论】：

有点类似[post][1]，可能有助于回答你的问题[1]：stackoverflow.com/questions/13043147/…

标签： javascript

【解决方案1】：

一种猜测是缺少.css 属性，另一种猜测是onclick 不是函数，而是调用函数的结果：

将所有.css 设为字符串并将函数分配给onclick：

style1.onclick = function () { swapStyleSheet("default.css") };
style2.onclick = function () { swapStyleSheet("dark.css"); };

【讨论】：

【解决方案2】：

将“default”.css 转换为“default.css”。对 dark.css 执行相同的操作。

然后onclick将一个函数作为一个值。

style1.onclick = function () { swapStyleSheet("default.css") };
style2.onclick = function () { swapStyleSheet("dark.css") };

【讨论】：

【解决方案3】：

 $('button').click(function() {
   let mainSheet = $('#pageStyle').attr('href');
   if(mainSheet == "default.css")
      $('#pageStyle').attr('href','dark.css');
   else
      $('#pageStyle').attr('href','default.css');
   });

【讨论】：

【解决方案4】：

您好，除非您在 html 中添加 onclick="" 属性，否则它不会起作用所以最终版本将如下所示： html

<head>
    <script type="application/javascript" src="javascript.js">
    <link id="pagestyle" href="default.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <button id="stylesheet1" onclick="initate();"> Default Style Sheet </button>
    <button id="stylesheet2" onclick="onclick="initate();"> Dark Style Sheet </button>
</body>

Javascript 文件

function swapStyleSheet(sheet) {
    document.getElementById("pagestyle").setAttribute("href", sheet);  
}

function initate() {
    var style1 = document.getElementById("stylesheet1");
    var style2 = document.getElementById("stylesheet2");

    style1.onclick = swapStyleSheet("default.css");
    style2.onclick = swapStyleSheet("dark.css");
}

【讨论】：

你能检查你的答案吗？我想你在那里放了一个额外的点击。