[英]JavaScript theme switcher issue
我正在创建一个主题切换器,但目前它没有在样式表之间切换。
我在下面有以下代码,我想在样式表之间切换以应用红色或灰色主题,灰色是默认主题。
<link rel="stylesheet" title="red" href="css/red.css" type="text/css">
<link rel="stylesheet" title="blue" href="css/grey.css" type="text/css">
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.0.min.js"></script>
<script language="javascript">
$(document).ready(function() {
$('#red').click(function (){
$('link[href="css/red.css"]').attr('href','css/red.css');
alert("red");
});
$('#grayscale').click(function (){
$('link[href="css/grey.css"]').attr('href','css/grey.css');
alert("grey");
});
});
</script>
</head>
<body>
<p> lorem ipsum lorem iuipsum </p>
<button id="original">Original</button><br />
<button id="grayscale">Grayscale</button>
<a href="#" id="red"> red</a>
<a href="#" id="grayscale"> grey</a>
这实际上并没有修改任何东西:
$('link[href="css/red.css"]').attr('href','css/red.css');
它找到链接到red.css
和...的link
,将其设置为链接到red.css
。 所以,没有变化。 这听起来像你的意思是找到一个灰色并将其链接到红色:
$('link[href="css/grey.css"]').attr('href','css/red.css');
当然,对于另一条线也是如此:
$('link[href="css/red.css"]').attr('href','css/grey.css');
此外,您可能只需要页面上的一个 link
标记。 两者都意味着始终应用这两种样式。 因此,他们之间的“切换”没有多大意义。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.