1

外部ページをiframeにロードして、そのページの背景色を変更しようとし
ましたが、コードは次のとおりです(機能していません-iframeページではなく親ページの色を変更します):

<style type="text/css">
iframe {
    background-color: #F00;
}
</style>

<iframe src="http://www.filehippo.com/" height="100%" width="100%">
</iframe>


<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('body').css('background-color', '#F00');
});
</script>
4

3 に答える 3

5

のsrc属性は、iframeその親ページと一致するドメイン、プロトコル、およびポートを持っていますか?

いいえ、iframe外部である場合、変更できない理由はSame Origin Policyです。

はいの場合は<body>、iframe に追加してこれを使用できます

$(document).ready(function(){
    $('iframe').contents().find('body').css('backgroundColor', 'Your Color');
});

だからあなたのコードは

<html>
<body>
<style type="text/css">
iframe {
    background-color: #F00;
}
</style>
<iframe src="http://www.filehippo.com/" height="100%" width="100%"></iframe>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('iframe').contents().find('body').css('backgroundColor', 'white');
});
</script>
</body>
</html>
于 2013-02-16T18:31:47.310 に答える
3

できません; filehippo.comなどの異なるドメインからの の内部を変更できないのは、セキュリティ上の制限です(たとえば、他のサイトのログイン ページを変更することがいかに危険かを考えてみてください)。iframe

一方、iframeのコンテンツが同じドメインからのものであっても、メソッドは機能しないことに注意してください。正しい方法については、この質問を参照してください。

于 2013-02-16T18:31:32.050 に答える
0

このオーバーライド カラーを本文にアーカイブする純粋な Javascript

Javascript

var x = document.getElementById("myframe");
var y = x.contentWindow.document;
y.body.style.backgroundColor = "red";

ライブを見るW3Schools

于 2014-09-16T13:41:05.393 に答える