网站主题颜色不变答案

【问题标题】：Website theme color not changing网站主题颜色不变
【发布时间】：2021-08-10 20:08:11
【问题描述】：

我想更改网站主题颜色，但我使用这种方式无法正常工作。有人可以帮忙吗？

<a href="javascript:void(0)" id="switch" class="gray-color">&nbsp;</a>
<a href="javascript:void(0)" id="switch2" class="green-color">&nbsp;</a>
<a href="javascript:void(0)" id="switch3" class="yellow-color">&nbsp;</a>

$("#switch").click(function () {
               $('head').append('<link rel="stylesheet" href="css/theme-gray.css"  title="gray" class="gray" />');
               $('link[title="yellow"]').remove();               
           });
$("#switch3").click(function () {
               $('head').append('<link rel="stylesheet" href="css/theme-yellow.css"  title="yellow" class="yellow" />');
               $('link[title="gray"]').remove();   
           });
$("#switch2").click(function () {
               $('link[title="yellow"]').remove();
               $('link[title="gray"]').remove();
 });

参考屏幕

【问题讨论】：

你想改变颜色链接还是追加新的然后删除新的？？？
我想改变颜色链接，但我使用了追加方法
“无法正常工作”是什么意思？会发生什么？
只有两种颜色的变化。第三种颜色不变
参考屏幕图片链接一：drive.google.com/open?id=1OfSBa9K3a6sKn9mXeZ2I5yHr1HY41SgF,

标签： jquery css html web

【解决方案1】：

试试这个代码。

$(".theme-link").click(function () {
    console.log($(this).attr("data-theme"));

    $('#theme').attr("href", $(this).attr("data-theme") );        
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" id="theme" href="css/theme-gray.css"  title="gray" class="gray" />

<a href="javascript:void(0)" data-theme="css/theme-gray.css" class="theme-link">gary</a>
<a href="javascript:void(0)" data-theme="css/theme-green.css" class="theme-link">green</a>
<a href="javascript:void(0)" data-theme="css/theme-yellow.css" class="theme-link">yellow</a>

【讨论】：