Question

我已经查看并测试了大量有关如何操纵父级iframe内容的示例。然而，在为自己尝试时，我无法让它工作 - 无论是在我的测试环境中（都在同一个域和url上）还是在jsfiddle：

http://fiddle.jshell.net/3x6mncxf/

我在这里做错了什么？

Answer 1

您只需稍微更改代码即可。而不是load（）方法使用ready（）方法

 $('iframe#frame').ready( function() {
      $('iframe#frame').contents().find("head").append($("<style type='text/css'>  body{display:none;}  </style>"));
 });

我已经分享了你的jsfiddle，你可以看到演示here

Answer 2

基于你的jsfiddle，你应该使用ready（）而不是load（），这是自JQuery v1.8以来已经弃用的。这段代码应该有效：

$('iframe#frame').load( function() {
    $('iframe#frame').contents().find("head").append($("<style type='text/css'>  body{display:none;}  </style>"));
});

或者，如果您只想隐藏一个元素，则可以始终使用css（）。

$('iframe#frame').contents().find("body").css("display","none");

Answer 3

基于http://api.jquery.com/load-event/

的推荐

尝试使用“ready”而不是“load”

$('iframe#frame').ready( function() { $('iframe#frame').contents().find("head").append($("<style type='text/css'>  body{display:none;}  </style>"));});

工作正常。除了几分钟我可以看到来自iframe的内容

使用jquery无法更改iframe的css（相同域）

3 个答案: