jQueryを使用してiframeのHTMLコンテンツを変更する

src属性にiframeがあり、その中にコンテンツがある別のhtmlページを指しています。jQueryを使用してiframeのHTMLコンテンツを変更する

parent.html

<body> 
    <iframe src="child.html"></iframe> 
</body>

のchild.html

<body> 
    <p>test1</p> 
</body>

parent.htmlものchild.htmlの身体に段落を追加しようとjqueryの機能を持っています

$(function(){ 
    var $iframe = $("iframe"); 
    $iframe.ready(function(){ 
     $iframe.contents().find("body").append("<p>test2</p>"); 
    }); 

});

問題は、機能が動作していない、段落が追加されていないことです。面白いのは、iframeのsrc属性から "child.html"を削除すると、その段落が空白のhtmlページに追加されているということです。

iframeからhtmlドキュメントの内容を変更することはできません（ドキュメントにはすでに多数の要素が含まれています）。

また、クロスドメインポリシーに問題はありません。

ありがとうございます。

出典

2016-10-29 fifth

実際にiframeの内容が読み込まれる前にコードが実行されているようです。このコードを試してください：

$(document).ready(function(){ 
    var $iframe = $("iframe"); 
    $iframe.on('load', (function(){ 
     $iframe.contents().find("body").append("<p>test2</p>"); 
    }); 
});

出典

2016-10-29 11:20:59

はい、動作します。私はこれを前に試してみましたが、コンソールに "Uncaught TypeError：a.indexOfは関数ではありません"というエラーがスローされているのを見たことはありませんでした。誰が興味を持っているのか、私はこの記事の解決策を使った：http://stackoverflow.com/questions/37738732/jquery-3-0-url-indexof-errorとにかく、助けてくれてありがとう、本当にありがたいです。 – fifth

更新しました私の答えのコード、頭のおかげで:) –

jQueryを使用してiframeのHTMLコンテンツを変更する

答えて

関連する問題