我有一个主样式表,有两组备用样式表.当激活一个样式表时,备用的两组样式表都将被禁用.主样式表是持久的,永远不会被禁用.备用样式表仅包含从主样式表中取出的不同元素,并且仅在激活时实现.我添加了具有两个组的类,以查看是否可以在组内激活一个组并在该组中停用其他组而不在另一个组中停用.我已经尝试了许多其他样式切换器和jquery方法,我没有任何地方,这是最好的结果呢.我真的很擅长这一切,并希望得到任何帮助.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="/files/theme/mainstyle.css" rel="stylesheet "type="text/css"/>
<link href="/files/theme/body1.css" rel="stylesheet" type="text/css" class="group1" title="body1" />
<link href="/files/theme/body2.css" rel="stylesheet" type="text/css" class="group1" title="body2" />
<link href="/files/theme/body3.css" rel="stylesheet" type="text/css" class="group1" title="body3" />
<link href="/files/theme/para1.css" rel="stylesheet" type="text/css" class="group2" title="para1" />
<link href="/files/theme/para2.css" rel="stylesheet" type="text/css" class="group2" title="para2" />
<link href="/files/theme/para3.css" rel="stylesheet" type="text/css" class="group2" title="para3" />
<script type="text/javascript" src="/files/theme/styleswitcher.js"></script>
</head>
Run Code Online (Sandbox Code Playgroud)
来自http://www.alistapart.com/articles/alternate/的styleswitcher.js文件
function setActiveStyleSheet(title) {
var i, a, main;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
a.disabled = …Run Code Online (Sandbox Code Playgroud)