在Web開發中，我們經常需要對樣式文件進行操作。在JavaScript中，我們可以通過讀取CSS文件來獲取樣式信息，然后將其應用于HTML元素上。下面我們來看一下如何在JavaScript中讀取CSS文件。

//讀取CSS文件
function loadCSS(url) {
var link = document.createElement('link');
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = url;
document.getElementsByTagName('head')[0].appendChild(link);
}
//獲取樣式信息
function getStyle(element, property) {
var style = window.getComputedStyle(element);
return style.getPropertyValue(property);
}
//應用樣式
function applyStyle(element, property, value) {
element.style[property] = value;
}
//使用示例
loadCSS('style.css'); //讀取CSS文件
var box = document.getElementById('box');
var color = getStyle(box, 'background-color'); //獲取背景色
applyStyle(box, 'color', color); //應用到字體顏色上

上述代碼中，我們使用了一些重要的函數。loadCSS函數可以通過創建元素并將其添加到標簽中來加載CSS文件。getStyle函數可以獲取元素的計算樣式，applyStyle函數則可以將樣式應用到HTML元素上。

需要注意的是，CSS文件必須在JavaScript文件之前加載，否則無法獲取樣式信息。此外，如果使用了外部樣式表，我們需要等待它加載完畢才能開始讀取其中的數據。

總之，通過讀取CSS文件，我們可以在JavaScript中獲取、操作和應用樣式信息，從而使HTML頁面更加動態和豐富。