Question

我正在创建一个主题切换器，但目前它没有在样式表之间切换。

我在下面有以下代码，我想在样式表之间切换以应用红色或灰色主题，灰色是默认主题。

<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>

Answer 1

这实际上并没有修改任何内容：

$('link[href="css/red.css"]').attr('href','css/red.css');

它找到链接到link的{{1}}并将其设置为链接到red.css。所以，没有变化。这听起来像意味着找到灰色并将其链接为红色：

red.css

当然，对于另一条线也是如此：

$('link[href="css/grey.css"]').attr('href','css/red.css');

此外，您可能只希望页面上有一个 $('link[href="css/red.css"]').attr('href','css/grey.css');标记。两者都意味着始终应用这两种样式。所以＆＃34;切换＆＃34;他们之间没有多大意义。

JavaScript主题切换器问题

1 个答案: