将css href属性更改为多个html页面

我想让用户在我的网站上为他们的体验选择一种颜色主题。 我创建了不同的主题外部CSS文件，并创建了一个功能，可以在我创建的所有颜色选项之间成功切换。

唯一的问题是，当我点击网站上另一个页面的链接时，主题返回到我创建页面的默认颜色。

有没有办法动态更改每个html页面的href属性，以便在每个页面上更改css颜色文件。 或者我需要cookies来记住这一点？ 我还没有了解cookies，但想知道这是否是一个功能。

以下是我的代码，它在该页面上的每种颜色之间进行了更改，但仅限于该页面上。

HTML：橙色主题紫色主题红色主题

Javascript：function setStyleSheet（url）{var stylesheet = document.getElementById（“stylesheet”）; stylesheet.setAttribute（'href'，url）; }

我有必要的css文件保存在外部。 任何帮助将受到欢迎。 谢谢。

---

理想情况下，你会使用cookies，但如果你真的很想不使用cookie，你可以尝试运行如下的东西：

var links = document.querySelectorAll("a");

for (i = 0; i < links.length; i++) {
    var existingHref = links[i].href;
    links[i].href += (links[i].href.indexOf("?") + 1 ? "&" : "?") + "theme=" + encodeURIComponent(theme);
}

（未经测试的代码，还有一些其他边缘情况，你想检查，但总体思路是在那里）

这将更新页面上的每个链接，添加一个theme=[theme]属性到它的URL，然后你可以通过解析window.location.search加载到以后的页面中：

function getTheme() {
    if (window.location.search.split("theme=").length < 2) return null;
    return window.location.search.split("theme=")[1].split("&")[0];
}

请注意，当我说“理想情况下”时，我的意思是说您应该使用Cookie - 它们已经制作完成并且几乎完全用于此目的，您不必处理粗略的边缘情况，就好像网址中已经存在theme ;或者如果它转到另一个也在URL中使用theme域，如果使用Javascript更改页面，它仍然可以工作，等等 - 但我相信这种方法也可以。

链接地址: http://www.djcxy.com/p/66081.html

上一篇: change css href attributes to multiple html pages onclick

下一篇: css added from remote node.js but not apply on html page