Question

我试图通过javascript将iframe插入到浏览器DOM中，并希望删除边框，如果IE但似乎无法。我试过这些无济于事：

iframeElement.style.borderStyle="none";

和

iframeElement.style.frameBorder = "0";

任何建议都将不胜感激。

Answer 1

奇怪的是，我今天早些时候正在寻找这个问题的答案。我发现将frameBorder设置为0属性确实有效，只要在将iframe添加到文档之前执行此操作。

var iframe = document.createElement("iframe");
iframe.frameBorder = 0;
document.body.appendChild(iframe);

Answer 2

frameBorder元素直接存在于iframe元素上，不是CSS属性。

尝试：

iframeElement.frameBorder = 0;

Answer 3

试试这个。它将在IE和其他浏览器中找到任何iframe元素并删除它们的边框（尽管您可以在非IE浏览器中设置CSS样式“border：none;”而不是使用JavaScript）。即使在iframe生成并在文档中就位后使用它也会有效（例如以纯HTML而不是JavaScript添加的iframe）！

这似乎有效，因为IE会创建边框，而不是iframe期望的iframe元素，而是iframe的内容 - 在BOM中创建iframe之后。（$ @＆amp; *＃@ !!! IE !!!）

注意：如果父窗口和iframe来自SAME源（相同的域，端口，协议等），IE部分将仅起作用（当然）。否则，脚本将在IE错误控制台中出现“访问被拒绝”错误。如果发生这种情况，您唯一的选择是在生成之前设置它，就像其他人注意到的那样，或者使用非标准的frameBorder =“0”属性。（或者只是让IE看起来很难看 - 我目前最喜欢的选项;））

花了我几个小时的工作到绝望的地方来弄明白......

享受。：）

// =========================================================================
// Remove borders on iFrames

if (window.document.getElementsByTagName("iframe"))
   {
      var iFrameElements = window.document.getElementsByTagName("iframe");
      for (var i = 0; i < iFrameElements.length; i++)
         {
            iFrameElements[i].frameBorder="0";   //  For other browsers.
            iFrameElements[i].setAttribute("frameBorder", "0");   //  For other browsers (just a backup for the above).
            iFrameElements[i].contentWindow.document.body.style.border="none";   //  For IE.
         }
   }

Answer 4

尝试iframeElement.style.borderCollapse = 1;或iframeElement.style.borderWidth = 0;

Answer 5

您还应该能够在HTML中使用“条件注释”，以便仅在IE8中包含“frameborder”属性：

 <!--[if IE 8]>
 <iframe id="my-iframe" frameborder="0"></iframe>
 <![endif-->
 <!--[if gt IE 8]><!-->
 <iframe id="my-iframe"></iframe>
 <!--<![endif]-->

如何使用javascript从IE中删除iframe边框

5 个答案: