@blog.justoneplanet.info

日々勉強

IEではJavaScriptでobject要素にembedを挿入できない

以下のコードを実行した時にIE6~8でエラーが発生する。appendChildやreplaceChildを使用してもできない。

var objectElm = document.createElement('object');
objectElm.setAttribute('classid', 'clsid:D27CDB6E-AE6D-11cf-96B8-444553540000');
objectElm.setAttribute('codebase', codebase);
objectElm.setAttribute('width', '240');
objectElm.setAttribute('height', '320');
var embedElm = document.createElement('embed');
embedElm.src = url;
embedElm.setAttribute('quality', 'hign');
embedElm.setAttribute('pluginspage', pluginUrl);
embedElm.setAttribute('type', 'application/x-shockwave-flash');
embedElm.setAttribute('width', '240');
embedElm.setAttribute('height', '320');
objectElm.appendChild(param1);
objectElm.appendChild(param2);
objectElm.appendChild(embedElm);//error - invalid argument(引数が無効です。)

クライアント側で

■解決策1

条件分岐して、IEのみobject要素に包括せず、embedのみを出力する。

var embedElm = document.createElement('embed');
embedElm.src = url;
embedElm.setAttribute('quality', 'hign');
embedElm.setAttribute('pluginspage', pluginUrl);
embedElm.setAttribute('type', 'application/x-shockwave-flash');
embedElm.setAttribute('width', '240');
embedElm.setAttribute('height', '320');
objectElm.appendChild(param1);
objectElm.appendChild(param2);
if(!!(window.attachEvent && !window.opera)){
    document.getElementById('flash').appendChild(embedElm);
}
else{
    objectElm.appendChild(embedElm);
    document.getElementById('flash').appendChild(objectElm);
}

■解決策2

object要素の後ろに殻のembed要素を挿入する。恐らくオリジナル。

var embedElm = document.createElement('embed');
embedElm.src = url;
embedElm.setAttribute('quality', 'hign');
embedElm.setAttribute('pluginspage', pluginUrl);
embedElm.setAttribute('type', 'application/x-shockwave-flash');
embedElm.setAttribute('width', '240');
embedElm.setAttribute('height', '320');
objectElm.appendChild(param1);
objectElm.appendChild(param2);
document.getElementById('flash').appendChild(objectElm);
if(!!(window.attachEvent && !window.opera)){
    document.getElementById('flash').innerHTML += '<embed></embed>';
}
else{
    objectElm.appendChild(embedElm);
}

なぜかチャント動くようになる。

参考

コメントはまだありません»

No comments yet.

RSS feed for comments on this post.TrackBack URL

Leave a comment