Javascript/jquery 根据 url 更改 css

Question

我需要创建一个脚本来更改页面的 css，具体取决于用户插入的 url。

例如

如果我使用这个 url:http://mypage.com/ 它显示了这个 css:<link rel="stylesheet" type="text/css" href="cssfolder/style.css">

但是如果我使用这个 url 例如，我需要:http://mypage.com/#color1 (或者您认为可以更好地实现相同目的的另一种 url 格式)

我需要根据 url 为新的 css 更改它并覆盖它，显示如下:<link rel="stylesheet" type="text/css" href="cssfolder/user1.css">

我需要它使用基于url的css，替换css文件名。

如果用户通过这种方式进入网站 http://mypage.com/#color1它将显示 blue.css(将所有内容更改为蓝色，将 Logo 更改为蓝色...)，如果输入 http://mypage.com/#red , css 变为red.css，全部显示为红色，但内容完全一样。

有人知道如何做到这一点吗？

Answer 1

这将获取您的哈希值并加载它。如果您要在运行时更改 #，则需要确保删除之前的，但这是假设您只会执行一次。

var hash_var = window.location.hash;
if (hash_var){
    $("<link />").attr({
      rel:"styleheet", 
      type:"text/css",
      href:hash_var.substring(1) + ".css"
    }).appendTo("head");
}