将CSS添加到iFrame

Question

可能重复:
如何将CSS应用于iFrame？

现在我通过jquery加载iframe:

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

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

  });

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

编辑:有问题的页面是通过file://Mobile Safari 加载的,因此跨域策略不适用.

Answer 1

基于解决方案您已经找到了如何将CSS应用于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(从使用jQuery将样式表附加到iframe):

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

至于安全问题:在Safari中禁用同源策略