javascript - 全局 iframe 文档

标签 javascript jquery html iframe

这是我几个月来遇到的第一个 js/HTML 问题,但我无法在网上找到答案。如果我使用 jquery 或纯 JavaScript 动态填充 iframe(所以我猜测与父文档同源),并且我使用一些脚本填充子 iframe 在使用“文档”全局的正文中 - IE“$(document ).ready”,如何确保它访问子文档而不是父文档?如果我使用以下 HTML 填充动态 iframe:

<iframe id='if'><iframe>

并在脚本标签中添加以下函数:

$(function () {
    var innerDoc = $($('#if').contents()[0].childNodes[0]);
    innerDoc.html("<scr" + "ipt>" + 
      "var h1 = document.createElement('h1'); " + 
      "h1.innerText = 'hi!';" +  
      "document.body.appendChild(h1);" +
    "</scri" + "pt>"); 
});

HTML 将插入到父文档的正文中。我确定这是因为动态插入 iframe 的脚本标记中的“文档”变量引用了父文档。如何确保精确语句正确执行,例如“document”变量将引用子 iframe 的文档?

最佳答案

显然使用 open() 和 writeln() 会使其按预期工作 - 但我不知道为什么。

 var iframedoc = $('#if').contents()[0];
 iframedoc.open();
 iframedoc.writeln("<html><head></head><body><scr" + "ipt>" + 
  "var h1 = document.createElement('h1'); " + 
  "h1.innerText = 'hi!';" +  
  "document.body.appendChild(h1);" +
"</scri" + "pt></body></html>");
iframedoc.close();

关于javascript - 全局 iframe 文档,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31465692/

相关文章:

html - 从 HTML 标记生成 CSS 文件

javascript - 用javascript显示奇数

javascript - 添加新内容时使用动画时 jQuery 问题

javascript - 如何从div[html+jquery]获取文本

函数中的 JQuery 变量有奇怪的行为

javascript - 创建一个书签,如果 div 包含特定文本,该书签将隐藏该 div

html - 在高度为 100% 的 Bootstrap 4 flex 容器上填充

javascript - jquery 脚本标签的意外标记非法

javascript - Mootools 元素到 HTML

javascript - 如何检测 div 或 body 的变化?