<ol start>をJavaScriptで

ol startが使えないとなるとどうすればいい? JSでのアプローチ

<ol start>をCSSでの続き。

依然として90%を占めるとされるMSIEが、近い将来、たとえ晴れて正式に7になったとしても、"counter-reset"や"counter-increment"に対応しないということが明らかになりつつある今日この頃、皆様におかれましてはいかがお過ごしでしょうか?(ってどこぞのきっこか、お前は^^;)

このような事態に直面したとき、ある意味、正攻法なアプローチとしては

  1. MSIEのことなんて無視する。 (とかいいながら、実は、MSIEに限らず、ケータイ類も現状では同じ問題を抱えているわけだが)
  2. XHTML1.1を捨てる。
    1. XHTML1.0Transitionalなどに文書型を変更する。
    2. XHTML1.1を拡張して、DTDレベルでol要素にstart属性を追加する。

といったことが考えられる。

ところが、自分自身はMSIEを無視できるほど世の中達観していないし、DTDを書き直すほどの知識もない。 人生(というと大袈裟だが)Strictではありたいと心で思いつつも彼方此方で妥協してばかりのハンパ者である。 そこで、ハンパ者はハンパ者らしく、安直かつインチキな方法で解決することにした。

その解法というのは

  1. MSIEだけJavaScriptで制御する

要するに、MSIEでアクセスしてきた人(ただし、JavaScriptやActiveX有効にしている人)だけでも、それなりに文意が通じるように操作してみたわけである。

当初は、MSIE独自のconditional commentの中でスクリプトを呼び出して、body属性でeval()構文を用いて条件分けしようと思ったのだが、パースエラーとか出まくったので、最終的に、mt-site.jsに逃げ込む形でスクリプトを突っ込んだ。 以下、そのmt-site.jsに突っ込んだソース。

// setStartAttr() for MSIE. Kazz [http://asamuzak.jp/]
// この例では、<ol class="counter2">など"counter[0-9]"の形を想定
function setStartAttr() {
 if(document.getElementsByTagName) {
  var ol = document.getElementsByTagName('ol');
  for(var i = 0; i < ol.length; i ++) {
   /*if(ol[i].className.match('counter')) {
   ol[i].setAttribute('start', ol[i].className.replace('counter', ''));
   */
   if(ol[i].className.match(/counter(\d+)/)) {
    ol[i].setAttribute('start', RegExp.$1);
    // クラス名から数字だけを取り出して、startの初期値として設定
    // コメントで指摘をいただき修正
   }
  }
 }
}

function writeTypeKeyGreeting(commenter_name, entry_id) {
 <MTIfRegistrationAllowed>
 (略)
 </MTIfRegistrationAllowed>
 if(document.all && !navigator.userAgent.match(/opera/i)) {
 // opera除けしつつほぼMSIE限定(未保証)
  setStartAttr();
 }
}

writeTypeKeyGreeting()はonload属性で呼ばれるので、その最後にsetStartAttr()を忍ばせておく。 その条件として、MSIE以外は参照しないようにするのがポイントといえばポイント。 ただ、MSIEでもJavaScriptやActiveXを無効にしている環境ではまるで意味がない(況やケータイをや)ので念のため。

"<ol start>をJavaScriptで"へのTwitter上でのコメントやRT

ツイートを取得できませんでした。