Question

我有以下HEAD标记

<head>
    <title>Test</title>
    <link id="css1" href="demo.css" rel="stylesheet" type="text/css">
</head>

我想在Javascript中能够以某种方式

document.head.children["css1"].href = "demo2.css";

任何想法，我希望能够通过id进行更改，因为头部可能有更多标签

Answer 1

在script之后之后的link标记中，您确实可以更新其href：

document.getElementById("css1").href = "demo2.css";

通常情况下，最好将script标记放在收尾</body>标记之前。在您的情况下，因为您正在更改CSS，以避免使用以前的样式＆＃34;闪烁＆＃34;在用户，您可能希望它更高，以便尽快处理。

Answer 2

This page告诉您如何执行此操作：

DEMO

的javascript

function swapStyleSheet(sheet) {
  document.getElementById('pagestyle').setAttribute('href', sheet);
}

HTML

<link id="pagestyle" rel="stylesheet" type="text/css" href="default.css">

<button onclick="swapStyleSheet('1.css')">1 Style Sheet</button>
<button onclick="swapStyleSheet('2.css')">2 Style Sheet</button>
<button onclick="swapStyleSheet('2.css')">3 Style Sheet</button>

在Javascript

2 个答案: