Question

您好，我正在创建自己的网站，我希望能够使用js更改页面的样式表和内容。

所以我写了这个：

<head>
    <link id="style" rel="stylesheet" href="css/index.css">
</head>

<header>
    <ul id="nav">
        <li> <input id="home" onclick="home()" type="image" src="vzbt.png" widht="55" height="55"></li>
        <li> <button id="links" onclick="links()">Links</button> </li>
        <li> <button id="about" onclick="about()">About Me</button> </li>
        <li> <button id="music" onclick="music()">Music</button> </li>
        <li> <button id="contact" onclick="contact()">Contact</button> </li>
    </ul>
</header>

这是我到目前为止写的js

function links(){
    document.getElementById("style").setAttribute = ("href", links.css);
}

但它不起作用，所以我想问一下有人可以帮助我吗？请。

Answer 1

我的猜测是你应该按照以下方式进行：

function links(){
    document.getElementById("style").setAttribute("href", "css/links.css");
}

由于links.css不是某些js变量，你应该把它放在“”

里面

Answer 2

不要将任何CSS加载到页面中。在加载页面时，确定哪个CSS然后使用以下方法动态地将所需的CSS添加到页面。您需要将所选主题存储在localStorage中，然后在页面加载时使用它来确定要加载的css文件。

请参阅：How to load up CSS files using Javascript?

Answer 3

setAttribute是一个函数，而不是属性（您尝试使用=为其分配值。）

function links(){
    document.getElementById("style").setAttribute("href", "css/links.css");
}

OR

function links(){
    document.getElementById("style").href = "css/links.css";
}

Answer 4

function links(){
  document.getElementById("style").href = path_Of_CSS_File;
}

您还可以将href的值指定给新值。

Answer 5

我觉得我觉得很愚蠢，因为“链接”不是一个功能而我没有想到它，所以我将它重命名为“链接”并且意外地工作得很好但是感谢所有人的参与你的时间，并试图帮助。

使用js更改样式表

5 个答案: