替代 CSS 选项 [重复]答案

【问题标题】：Alternative CSS option [duplicate]替代 CSS 选项 [重复]
【发布时间】：2013-03-07 03:03:57
【问题描述】：

我在提供替代 CSS 时无法显示正确的 CSS。

我的 head 部分中有这两个 CSS 文件：

<link href="css1.css" rel="stylesheet" type="text/css" /> 
<link id="css2" href="css2.css" rel="stylesheet" type="text/css" />

和正文中的这个href：

<a href="#" onclick="document.getElementById('css2').href='css2.css'">Change</a>

页面显示 css2（背景颜色设置为绿色），但我希望它显示 css1（红色），然后单击 css2 链接，它应更改为 css2。

注意：CSS 可以正常工作，每个 CSS 文件只是具有不同的 background-color 属性。

【问题讨论】：

【解决方案1】：

你的锚应该调用一个javascript函数来添加

<link id="css2" href="css2.css" rel="stylesheet" type="text/css" />

动态地添加到您的文档中。在 jquery 中可以这样做：

$(document.body).append('<link href="css2.css" rel="stylesheet" type="text/css" />');

【讨论】：

有些人不喜欢 jQuery，我通常从他们使用的简单代码中看出。但我也喜欢你的方式。美元符号和语法可能会吓跑他们，但有些人只想要 jQuery 解决方案......无论如何。只是想帮忙。

【解决方案2】：

<link href="css1.css" rel="stylesheet" type="text/css" /> 
<link href="css1.css" id="css2"  rel="stylesheet" type="text/css" />

和正文中的这个href：

<a href="#" onclick="document.getElementById('css2').href='css2.css'">Change</a>

【讨论】：