将CSS添加到iFrame

时间:2011-08-05 17:40:29

标签: jquery css iframe

  

可能重复:
  How to apply CSS to iFrame?

现在我正在通过jquery加载iframe:

 $(window).load(function(){
  $('iframe').load(function() {
      $('iframe').show()
      $('#loading').hide();

    });
    $('#loading').show();
    $('iframe').attr( "src", "http://www.url.com/");

  });

我有一个自定义样式表,我想将其应用于该页面。 iframe中的页面不在同一个域中,这就是为什么它很棘手。我找到了允许您添加单个标签的解决方案,但不是整个样式表。

编辑:相关网页是通过移动版Safari中的file://加载的,因此跨网域政策不适用。

1 个答案:

答案 0 :(得分:55)

基于解决方案您已找到How to apply CSS to iframe?

var cssLink = document.createElement("link") 
cssLink.href = "file://path/to/style.css"; 
cssLink .rel = "stylesheet"; 
cssLink .type = "text/css"; 
frames['iframe'].document.body.appendChild(cssLink);

或更多jqueryish(来自Append a stylesheet to an iframe with jQuery):

var $head = $("iframe").contents().find("head");                
$head.append($("<link/>", 
    { rel: "stylesheet", href: "file://path/to/style.css", type: "text/css" }));

安全问题:Disabling same-origin policy in Safari