IEでappendChildできないときはcanHaveChildrenで調べる
タイトルそのまんまですがそういうことなんです。
var elm = document.createElement("br"); elm.appendChild(document.createTextNode("test!!")); //IEではエラー
上のコード、IEではエラーが出るけど、chrome/ffでは何も言われません。
当然br要素にappendChildしても何も変わりはせず、無視されるだけ。
が、こういう時に限って我らがIE(7・8)さんはエラーを出してくれるわけです。
一応こういう場合のためにIEでは canHaveChildren というプロパティで、その要素にappendChild出来るかどうかを確認できるようになってます。
var elm = document.createElement("br"); if(elm.canHaveChildren){ elm.appendChild(document.createTextNode("test!!")); }else{ alert("elm can't have child!!"); }
brだけじゃなくてimgとかの置換要素もこれで確認。
正直言うとこの件についてはIEみたいな確認できるプロパティが欲しい。何の変化も及ばないようなことしても無視されるとかバグの温床にしかならないだろうし。
IEは独自実装調べていくと結構面白いことしてたりするし、ものによってはIEが元になってcss3で標準化されたりとかしてる。一瞬だけIEのことが好きになったりした。本当に一瞬だけ。