cssに規定されていないプロパティをJavaScriptから取得できるのか

cssのルールとして規定されていないプロパティをcss内に書いたら、
それはJavaScriptからとれるんだろうか、とふと思った。

cssはこんな感じ。

/* hoge.css */
#hoge {
  width: 200px; /* 普通に指定 */
  shinout: cool; /* computedStyleにはないプロパティの指定 */
}

で、これを

<head>
<link rel="stylesheet" href="hoge.css" />
</head>

で読み込んで

//スタイルシートオブジェクトの取得！
var css = document.styleSheets[0];

// ルールの取得
var rules = css.cssRules || css.rules; // クロスブラウザな意味で。
alert(rules[0].cssText);

こう書いておく。

すると、

#hoge { width: 200px; }

と表示される。

そりゃそうか。
shinout: cool;

という事実は見事に葬り去られた。

悲しい。

おかしいと思って

#hoge {
shinout: crazy;
}

としてみたが結果は変わらなかった。

ゴミCSSをブラウザがはじいてからDOMモデルに値を設定してるってことさ。

と、思ったがここは大人気アイドルIE先生。

IE先生でやったら、どうやら、
document.styleSheets[0].rules[0].cssTextなるものは存在しないようで、
document.styleSheets[0].rules[0].style というプロパティがあった。

これを見てみると・・・

  [width]   200px
  [shinout] cool

となっているではないか！

shinout is cool!

IEでは、意味のないCSSプロパティをとることができたぞーーー！

これができると、
css3のプロパティ名とかもhtcファイルで取得して
擬似的に再現できちゃいそうですねー！

まさにIEに一番必要な機能だわこれ！