【質問】JSのDOMContentLoadedが発火しません。

Question

【質問】JSのDOMContentLoadedが発火しません。

■事象
iframeを動的に作成(createElement)して、
addEventListenerに「DOMContentLoaded」を追加しているが、
iframeのsrc先のDOM読み込み完了時にイベントが発生しません。

■コーディング

var parent_obj = document.getElementById("top");
var obj = document.createElement('iframe');

if(obj.addEventListener){
	obj.addEventListener("DOMContentLoaded",xxx);//★これが発火しない
	//obj.addEventListener("load",xxx);//☆遅い
}else if(obj.attachEvent){
	obj.attachEvent("onload",xxx);
}else{
	obj.onload = xxx;
}

parent_obj.appendChild(obj);
obj.src = "URL";

function xxx(e){
	alert("発火");★これが発火しない
}

■やりたい事
addEventListener("load",xxx)だと画像読み込み後にイベントが発生するので、遅いです。
iframeのソースが返ってきた直後にイベントを呼びたいのです。

■質問
なぜDOMContentLoadedが発火しないのでしょうか。
コーディングが悪いのでしょうか？

それともcreateElement('iframe')はDOMContentLoadedのイベントに対応していないのでしょうか？
その場合、上記【やりたい事】の代案はございますでしょうか？

Answer 1

検証した訳ではないのでハズレかもしれませんが・・・

iframe の中の document オブジェクトに document.addEventListener("DOMContentLoaded", ...) しなければダメなのではないですか？

iframe は親ページとは別 window で、その中の document オブジェクトを取得するには contentWindow プロパティ（IE 用）または contentWindow.document（Firefox 他）を使います。

具体例は以下の記事を見てください。（注：その記事のコードの $get() は document.getElementById() と同じです）

http://surferonwww.info/BlogEngine/post/2013/01/27/hide-modalpopup-by-clicking-a-button-placed-in-another-page.aspx

ただし、iframe に表示するページは親ページと同じドメインのものでないと DOM が取得できないので注意してください（クロスサイトスクリプト対策だそうです）。

Comments

[zatsudayo]

クロスオリジン、クロスドメインがやりたい事の前提です。
その場合、DOM系のイベントが使えないのですね。
それでは上記【やりたい事】の代案はございますでしょうか？

[退会済みユーザー]

iframe を使う以上私には代案はないです。