如何使用JavaScript更改链接的HREF？

Question

我正在制作游戏，我想让玩家单击以切换页面颜色。 具体来说，我希望玩家能够将Bootstrap主题（遵循从Bootswatch提取的主题）从Cerulean更改为Darkly，以使页面样式看起来有所不同。

为此，我需要能够使用JavaScript更改链接的HREF。 我该怎么做呢？

Answer 1

由于您使用的是twitter-bootstrap ，因此我假设您使用的是jQuery 。 您可以通过简单的调用来更改<link>的href属性：

$("link[href=OLDHREFYOUWANTTOCHANGE]").attr("href", newURL.com)

但是，恐怕这不一定会为页面重新加载CSS。 也许您可以为网站设置window.location.hash （或其他一些参数），并根据其加载特定的样式表集。

例如，在页面顶部：

<script>
    var hash = window.location.hash;
    if (hash === "#blue")
        //add blue stylesheet
    else
        //add red stylesheet
</script>

Answer 2

使其正常工作的最简单方法是简单地重新加载页面，并仅根据需要加载特定的CSS文件。

但是您可以像这样添加一个新的CSS文件，不确定它是否在所有情况下都能正常工作，因为它不会重置您的旧CSS：

var link = $('<link>');
link.attr({
        type: 'text/css',
        rel: 'stylesheet',
        href: <your CSS file url>
});
$('head').append(link); 

Answer 3

如果您使用的是jQuery，请使用以下代码：

$(location).attr('href','http://www.newurlorwhatever.com');