JS 是一門非常強大的編程語言。不僅可以操作 DOM 元素，還可以操作 CSS 樣式。在這一篇文章中，我們將討論如何使用 JS 動態執行 CSS 文件。
在開始之前，先創建一個 HTML 文件，并在其中添加一個按鈕：
<html> <head> <link href="style.css" rel="stylesheet" type="text/css"> <script src="script.js"></script> </head> <body> <button onclick="loadCSS()">Load CSS</button> </body> </html>
此時，我們需要在 script.js 文件中定義一個函數，用于動態加載 style.css 文件：
function loadCSS() {
var link = document.createElement("link");
link.href = "style.css";
link.rel = "stylesheet";
link.type = "text/css";
document.head.appendChild(link);
}該函數首先創建了一個 link 元素，并設置其 href、rel 和 type 屬性。然后將該元素添加到 head 標簽中?，F在，當用戶點擊“Load CSS”按鈕時，style.css 文件將被動態加載。
除了使用 JavaScript 動態加載 CSS 文件外，我們還可以使用 AJAX 來加載外部 CSS 文件。下面是一個示例函數，可以使用 AJAX 加載 CSS 文件并將其添加到 head 標簽中：
function loadCSSWithAjax(url) {
var xhr = new XMLHttpRequest();
xhr.onload = function () {
var link = document.createElement("link");
link.href = url;
link.rel = "stylesheet";
link.type = "text/css";
document.head.appendChild(link);
};
xhr.open("GET", url);
xhr.send();
}該函數通過 XMLHttpRequest 對象進行 AJAX 調用，并設置 onload 函數來處理響應。當響應成功時，該函數將創建一個 link 元素，并將其添加到 head 標簽中。現在，我們可以在 HTML 文件中調用此函數，如下所示：
<button onclick="loadCSSWithAjax('style.css')">Load CSS</button>到此為止，我們已經學會了如何使用 JS 動態執行 CSS 文件。無論是使用 JavaScript 動態加載 CSS 文件，還是使用 AJAX 加載外部 CSS 文件，都是非常有用的技術。
上一篇mysql5.6文件安裝
下一篇js 加 css