使用Javascript或jQuery将元素写入子iframe

我有这样的事情:

我想使用jQuery编写元素,以便完全等效的HTML将是这样的:

或者,任何普通的Javascript都可以.

谢谢.

编辑:经过一些研究,似乎我正在寻找一个IE等效的iframe的contentDocument属性."contentDocument"是FF支持的W3C标准,但IE不支持.(惊喜)

你可以做到这两点,你只需要有不同的目标:

var ifrm = document.getElementById('myIframe');
ifrm = ifrm.contentWindow || ifrm.contentDocument.document || ifrm.contentDocument;
ifrm.document.open();
ifrm.document.write('Hello World!');
ifrm.document.close();

经过一些研究,以及迈克的确凿答案,我发现这是一个解决方案:

  var d = $("#someFrame")[0].contentWindow.document; // contentWindow works in IE7 and FF
  d.open(); d.close(); // must open and close document object to start using it!

  // now start doing normal jQuery:
  $("body", d).append("
A
B
C
");

有两种可靠的方法可以访问document内部的元素iframe:

1. window.frames属性:

var iframeDocument = window.frames['iframeName'].document; // or // var iframeDocument = window.frames[iframeIndex].document;

演示

2. contentDocument属性:

var iframeDocument = document.getElementById('iframeID').contentDocument; // or // var iframeDocument = document.getElementById('iframeID').contentWindow.document;

演示

我在这里走出困境并建议到目前为止提出的答案是不可能的.

如果这个iframe实际上有一个src ="somepage.html"(你应该指出,如果没有,那么使用iframe是什么意思？),那么我不认为Jquery可以在所有浏览器中跨框架直接操作html .根据我对这种事情的经验,包含页面不能直接调用函数或与iframe页面进行任何类型的Javascript联系.

您的"somepage.html"(在iframe中加载的页面)需要做两件事:

将某种对象传递给可用作桥的包含页面

具有根据需要设置HTML的功能

例如,somepage.html可能如下所示:

并且包含的​​页面可能如下所示:

这可能看起来有点令人费解,但它可以在多个方向上进行调整,至少可以在IE,FF,Chrome以及Safari和Opera中使用......