Jintrick.netagenda2002年02月アーカイブ → 2002年02月22日

MacIEのDOM / innerHTML, innerText等

生成したら、即挿入ですね。type=hiddenなINPUT要素は怪しい、と。

今後もバグ等でご迷惑があれば、お叱り頂ければ。

JavaScript for CSS (10)document.implementation情報より、MacIE5はDOM1 HTML対応を謳っている優等生だと思っていたのですが、そのような罠が。WinIEも、type=hiddenなINPUT要素の生成はかなり怪しいものがありました。with文を使うと属性が設定できなかったり。

以下DOMオタ話なので、長い上につまらないかもしれません。

innerHTMLはダサいですか。私も過去ログでダサいと書いていた気がします。しかしイベントで関数を呼び出す際、DOM(addEventLisener)でやろうとするとIEが立たず、onclickに代入するとMozillaが立たずで、負けました。

ただ、ちと無関係ですが、さらにダサいであろうinnerTextは、かなり便利であると言わざるを得ません。

<h2>H2の内容<span>日付など</span></h2>

マークアップの妥当性はともかくとして、これのTextNodeだけを連結させて抜き出す、という用途を考えてみると、どうしてもinnerTextを使いたくなってしまいます。でもこの際だから正規のDOMだけでなんとかしてみようかと。

function getInnerText(element){
 var children = element.childNodes;
 var texts = new Array();
 var j = 0;
 for(var child, i=0; i<children.length; i++){
  child = children.item(i);
  if(child.nodeType == 1){
   texts[j] = getInnerText(child);
   j++;
   continue;
  } else if(child.nodeType == 3){
   texts[j] = child.nodeValue;
   j++;
  }
 }
 return texts.join();
}

私の持っている知識で考えたら、こんな冗長になっちまいましたよ、師匠。ただ、変なゴミがくっついてしまうので、多分まだ何か足りないor間違っているのでしょう。なんかもう頭がこんがらがってしまって駄目です。

←こちらはマシンスペックに自身のある方だけどうぞ。alertダイアログはEnterキーでクリアします。ウチ(Win98 AMD-K6 550MHz 192MB)のMozillaでは5秒程かかりました。

二年ぶりに改訂してみました。動作未確認。

function getInnerText(element){
 var children = element.childNodes,
 texts = new Array();
 for (var child, type, txt, i=0; i<children.length; i++){
  child = children.item(i),
  type = child.nodeType;
  switch(type){
   case 1: // Element Node
    texts.push(getInnerText(child)); break;
   case 3: // Text Node
    txt = texts.push(child.data); break;
   default: break;
  }
 }
 return texts.join('');
}

webmaster@jintrick.net
公開: 2002年02月22日
カテゴリ: DOM ,意見交換, 批判等