首页js添加css

js添加css

时间: 2023-07-31 08:12:38 浏览: 87

可以使用JavaScript代码来添加CSS样式，具体方法如下： 1. 创建一个新的<style>标签，通过document.createElement()方法来创建： ``` var style = document.createElement('style'); ``` 2. 将CSS样式写入到style标签中，通过style.innerHTML属性来设置： ``` style.innerHTML = 'body { background-color: red; }'; ``` 3. 将style标签添加到HTML文档中的<head>标签中，通过document.head.appendChild()方法来添加： ``` document.head.appendChild(style); ``` 完整的代码示例： ``` var style = document.createElement('style'); style.innerHTML = 'body { background-color: red; }'; document.head.appendChild(style); ``` 这样就可以通过JavaScript来动态添加CSS样式了。

js动态加载css文件

在JavaScript中，可以通过动态创建<link>元素来加载CSS文件。首先，我们需要创建一个<link>元素，并设置其rel属性为"stylesheet"，type属性为"text/css"，href属性为CSS文件的路径。例如： ```javascript var link = document.createElement("link"); link.rel = "stylesheet"; link.type = "text/css"; link.href = "style.css"; ``` 接下来，我们需要将创建的<link>元素添加到文档的<head>元素中。可以通过document.head属性来获取<head>元素，并使用appendChild()方法将<link>元素添加到其中。例如： ```javascript document.head.appendChild(link); ``` 通过以上代码，CSS文件将被动态加载到页面中。请确保CSS文件的路径正确，并且在JavaScript代码执行时，<link>元素未被添加到DOM树中。动态加载CSS文件在某些情况下非常有用，例如在需要按需加载CSS样式的情况下，可以提升页面的加载速度和性能。

阅读全文