selectorText／cssTextプロパティ
■ルールオブジェクト.selectorText
・ルールのセレクタ文字列を取得（「p {color:black}」のp)
■ルールオブジェクト.cssText
・セレクタに設定されている「プロパティ:値」形式を取得、また書き換えできる
・「p {color:black}」の color:black
Sample
このページに適用されている全てのスタイル情報を
(特記）FireFox、Chromeでは、何故かこのページの外部CSSファイルを取得できない。styleSheetオブジェクト数には数えられるが、cssRulesで取得しようとするとScript自体が動かなくなる。ページ内部の<style
type="text/css">のcssRulesは正常に取得できるのでコードの記述間違いではないと思うんですが･･･？
そこで、少々ややこしいがIE以外では外部CSSファイルのcssRulesを取りに行かないようにしました。あしからず･･･
（ネットで探したが、同様のトラブルを見つけられなかった。多分私の外部CSSファイルの記述法に問題があるのではないかと、今のところ想像しています･･･でもIEでは正常なのに）
Sample Source......................................................................>>>
<link rel="stylesheet" href="../css_css.css" type="text/css">
<style type="text/css"><!--
div.sample h5 { background-color:lavender;color:green;}
-->
</style>
<script type="text/javascript"><!--
function Test(){
var sheets = document.styleSheets;
var str = '';
for (var i = 0; i < sheets.length; i++) {
var sheet = sheets[i];
if(sheet.rules){
//IEの場合
var rules = sheet.rules;
str += "<br>━━……‥ ・．<br>" + (i+1) + "番目は[" + sheet.href + "]にあり、
ルール数は[ " + rules.length + " ]個です･････････<br><br>";
for (var j = 0; j < rules.length; j++) {
var rule = rules[j];
str += rule.selectorText + " { " + rule.style.cssText + "}<br>";
}
}else{ //IE以外では
if(i == 0){alert("外部ＣＳＳファイルは取れません！");
}else{
var rules = sheet.cssRules;
str += "<br>━━…… ・ ・．<br>" + (i+1) + "番目は["
+ sheet.href + "]に
あり、ルール数は[ " + rules.length + " ]個です･･･････････････<br><br>";
for (var j = 0; j < rules.length; j++) {
var rule = rules[j];
str += rule.selectorText + " { " + rule.style.cssText + "}<br>";
}
}
}
}
document.getElementById("view").innerHTML = "<p>"
+ str + "</p>";
}
// --></script>
</head>
<body>
<p class="sample">このページに適用されている全てのスタイル情報を
<button onclick="Test()">書き出す</button></p>
<div id="view" style="width:520px;border:1px solid green"></div>