WebKit は document.defaultView.getComputedStyle の戻り値がちょっと便利

<html><head><title></title></head><body onload="boot()"><script>
function boot() {
  var cs = document.uniqueID ? document.body.currentStyle
                             : document.defaultView.getComputedStyle(document.body, "");
  alert(cs["textAlign"]);
  alert(cs["text-align"]);
}
</script></body></html>

実行するとこうなります。

Browser textAlign text-align
Opera9.2 left undefined
Opera9.5 left undefined
Opera10α left undefined
Firefox2 start undefined
Firefox3 start undefined
Firefox3.5β4 start undefined
Chrome2 auto auto
Safari4β auto auto
IE8(mode7) left undefined
IE8 left undefined

ポイント

  • IE は document.defaultView.getComputedStyle をサポートしていません。
    • いこじです。
  • 仕様では、text-align の初期値は 'left' または 'right' です。
    • 仕様と違うブラウザが沢山あるのは?
      • 'start' や 'auto' も、右書き(direction = rtl) の環境を考慮したものでしょう。
      • ちなみに、<canvas> の textAlign の初期値は 'start' です。'start' は TPO により 'left' または 'right' と同じ結果になる便利なキーワードです。
  • WebKit は、cs["textAlign"] でも cs["text-align"] でもアクセスできます。
    • 便利機能ですが、これもW3Cの仕様には無い動作です。
      • cs["-webkit-text-stroke"] などとの兼ね合いでこうしてるのかな? わざわざキャメライズする現行仕様よりも自然ですね。
      • 他のブラウザも追従してほしいところです。