jsでiframe内部のノードを操作

jQueryの場合

$('iframeのセレクタ').contents().find('iframe内部のセレクタ')
// findが取得したものがiframe内部のHTMLノード

// 例:ID=fooiframeのiframe中のID=barnodeのノードを隠す場合
$('#fooiframe').contents().find('#barnode').hide();

Javascriptだけの場合

document.getElementById('iframeのセレクタ').contentWindow.document.getElementById('iframe内部のセレクタ')
// これでfindが取得したものがiframe内部のHTMLノード

// 同じ例で言うと:
document.getElementById('fooiframe').contentWindow.document.getElementById('barnode').style.visibility="hidden";

iframe内部のノードにイベントを追加する場合

iframeの外からjQueryでclickのイベントを追加

$(window).load(function(){
	$('#fooiframe').contents().find('#barnode').click(function(){
		// 実装コード
	});
});

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>