Question

我经常看到使用包含外部网站的iframe的网站，以及包含用户JavaScript功能的顶部框架。

e.g。用户分析软件，Digg吧等......

有关类似试验的任何提示吗？知道

会很棒

Answer 1

不，不是来自外部 iframe。 <iframe>是它自己的世界。如果域等匹配，那么Javascript可以进出通信，并且可以（如果它想）将CSS注入到子帧中。

如果<iframe>包含来自其他域的内容，那么您几乎无能为力。父页面控制框架的大小以及它是否可见，并且可以通过定位等将其自己的内容放在框架上，但它不能直接影响实际框架内容的呈现方式。

Answer 2

如果它属于同一个域，您可以使用javascript干扰iframe内容，如下所示。假设iframe的id为IframeId。并且您想要更改具有id＆＃34; elementId＆＃34;。

的元素的颜色

$("iframe").load(function() {
   var frameContents;
   frameContents = $("#IframeId").contents(); 
   frameContents.find("#elementId").css("color","#fff");
});

Answer 3

这可以通过将 CSS 链接注入 iframe 的 Header 来实现：

    // this function will inject the link to CSS into iframe header
    function loadCSSToiFrame(iframeId, filename){ 
       var file = document.createElement("link");
       file.setAttribute("rel", "stylesheet");
       file.setAttribute("type", "text/css");
       file.setAttribute("href", filename);
       document.getElementById(iframeId).contentWindow.document.head.appendChild(file);
    }
  
    // just call a function to load your CSS
    // this path should be relative your HTML location
    loadCSS("iframe_id", "stylesheet.css");

我可以将CSS应用于iframe中的元素吗？

3 个答案: