在前端開發中，有時候需要在頁面中動態地加載CSS文件。下面介紹一下如何使用JavaScript來實現。 首先，我們需要創建一個link元素，用來加載CSS文件。可以使用以下代碼：

var cssFile = document.createElement("link");
cssFile.setAttribute("rel", "stylesheet");
cssFile.setAttribute("type", "text/css");
cssFile.setAttribute("href", "style.css");
document.head.appendChild(cssFile);

代碼解釋： 1. 使用createElement()方法創建一個link元素。 2. 使用setAttribute()方法設置link元素的屬性，例如rel、type和href等。 3. 使用appendChild()方法將link元素添加到head中。 接下來，我們將上面的代碼封裝成函數，方便調用和重復使用。例如：

function loadCSSFile(file) {
var cssFile = document.createElement("link");
cssFile.setAttribute("rel", "stylesheet");
cssFile.setAttribute("type", "text/css");
cssFile.setAttribute("href", file);
document.head.appendChild(cssFile);
}
loadCSSFile("style.css");

代碼解釋： 1. 創建一個名為loadCSSFile的函數，參數為file。 2. 函數內部是之前的代碼，將CSS文件加載到頁面中。 3. 最后一行調用loadCSSFile函數，并傳入要加載的CSS文件名。 以上就是使用JavaScript動態加載CSS文件的方法。該方法可以在頁面加載完成后動態地添加CSS文件，從而實現更加靈活的布局和樣式。