在網頁開發中，我們經常需要遍歷CSS樣式，這樣可以輕松的查看當前頁面的樣式結構。下面就來介紹一下如何使用JavaScript遍歷CSS樣式。

var allCSS = document.styleSheets;  //獲取所有CSS樣式表
for (var i = 0; i< allCSS.length; i++) {  //遍歷每一個CSS樣式表
var rules = allCSS[i].cssRules;  //獲取當前CSS樣式表的所有規則
for (var j = 0; j< rules.length; j++) {  //遍歷每一個CSS規則
var selector = rules[j].selectorText;  //獲取CSS規則的選擇器
var props = rules[j].style;  //獲取CSS規則的屬性
console.log(selector + ':');  //輸出選擇器
for (var k = 0; k< props.length; k++) {  //遍歷每一個CSS屬性
console.log('\t' + props[k] + ': ' + props[props[k]] + ';');  //輸出屬性和屬性值
}
}
}

上述代碼首先獲取了所有的CSS樣式表，然后遍歷每一個CSS樣式表，再遍歷每一個CSS規則，從CSS規則中獲取選擇器和屬性，并輸出到控制臺上。

通過這樣的方式，我們可以方便地查看當前頁面的CSS樣式結構，為后續的調試和優化提供了方便。