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

Question

我正在尝试通过 JavaScript 将一个 iframe 插入到浏览器 DOM 中，并希望在 IE 中移除边框，但似乎无法实现。我已经尝试了以下方法，但都没有成功：

iframeElement.style.borderStyle="none";

并且

iframeElement.style.frameBorder = "0";

非常感谢任何建议。

- pythoner

---

+1，我也遇到了同样的问题，Tim的答案非常完美。顺便说一下，标题需要编辑：javsascript。如果我能的话，我会去做的。 - Pedro

这个似乎在IE8上可以工作，（IE真是让人头疼！！） - user3085927

Answer 1

奇怪的是，我今天早些时候也在寻找这个问题的答案。我发现将 frameBorder 属性设置为 0 可以解决此问题，但前提是您在 iframe 添加到文档之前进行设置。

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

- Tim Down

---

+1 非常有趣。IE8 仍然存在同样的问题，你能相信吗！？在行内添加 frameBorder 会使文档不再符合 HTML5 的验证规则，所以唯一的方法是像你建议的那样通过 JS 添加它。 - Marco Demaio

Answer 2

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

尝试使用：

iframeElement.frameBorder = 0;

- Christian C. Salvadó

---

我已经踩了这个答案，做了更多的研究后发现这个答案并不完全错误（请查看我的回答以作澄清），但是显然除非编辑这个答案，否则无法取消我的踩。很抱歉。 - Tim Down

@Tim：别担心，我已经编辑过了，如果你想撤回你的反对票，我在DOM Core Level 2规范中添加了一个frameBorder属性的链接... - Christian C. Salvadó

Answer 3

尝试这个。它将找到任何iframe元素并从IE和其他浏览器中移除它们的边框（尽管在非IE浏览器中，您可以设置CSS样式为“border：none;”而不是使用JavaScript）。并且，即使在文档中放置iframe之后再使用（例如纯HTML添加的iframe而非JavaScript），它也能正常工作！

这似乎有效是因为IE会在iframe的内容上创建边框，而不是在你所期望的iframe元素上，且是在BOM中创建iframe之后。($@&*#@!!! IE!!!)

注意：IE部分只有在父窗口和iframe来自相同的来源（相同的域，端口，协议等）时才适用。否则，脚本将在IE错误控制台中出现“访问被拒绝”的错误。如果发生这种情况，您唯一的选择是在生成iframe之前进行设置，如其他人所述，或使用非标准的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.
         }
   }

- FirstFraktal

Answer 4

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

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

- moloko

Answer 5

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

- Anatoliy