javascript 如何获取iframe里面的内容？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了javascript 如何获取iframe里面的内容？相关的知识，希望对你有一定的参考价值。
我在一个页面里面嵌入了一个iframe，里面有一个表单id="link"，请问可不可以通过javascript获取iframe里面表单里面的内容到当前页面？
要解释这个问题，首先要解释两个技术点。
每个“窗口”都是一个JS Runtime，即JS的运行时。如果只有一个窗口，那么就只有一个Runtime；如果一个窗口下面还有一个iframe，那么就有两个Runtime；以此类推。
Runtime之间互操作（或者通信）是有跨域限制的。也就是说，如果这个窗口本身是a.baidu.com域名下的页面，那么如果这个页面下还有一个iframe，这个iframe中加载的页面是b.baidu.com域名下的。那么外层的JS。就不能跟这个iframe中的内容互操作（或者通信）。
因此外层Runtime中的JS想操作内层iframe中的内容，就必须要避免跨域限制。要么内层iframe加载页面的域名跟外层是一样的。要么就是需要在内层iframe加载的页面中执行document.domain = 'baidu.com';从而设置跟外层的主域相同。
例如，当前页面是a.baidu.com/test.html
<html><head>
</head>
<body>
<iframe id="iFrm1" src="
<script>
document.domain = 'baidu.com';
var ifrm1 = document.getElementById('iFrm1');
ifrm1.onload = function()
alert(ifrm1.contentWindow.document.getElementById('innerDiv').innerHTML);//弹出恭喜你操作到内部iframe中的元素了！！！
;
</script>
</body>
</html>
iframe中加载的页面内容如下：
<html><head>
</head>
<body>
<div id="innerDiv">恭喜你操作到内部iframe中的元素了！！！</div>
<script>
document.domain = 'baidu.com';
</script>
</body>
</html>
在HTML5中新增了postMessage的API。可以方便窗口跟内部iframe之间进行通信，并且可以实现跨主域通信。但是有一些限制，1.老版本的浏览器一般不支持。2.父窗口只能向iframe中发送信息，iframe只能收消息，且父窗口不能直接操作iframe中的内容。3.父窗口发送的数据也是有限制的。只能发送基本数据类型或者plain object。
参考技术A 如果不跨域是可以的,在父级页面使用alert(document.getElementsByTagName('IFRAME')[0].contentWindow.document.getElementById('link').控件名.value);
如果iframe有id属性,也可以通过id来获取该框架,如果表单控件有id,也可以直接使用其id来获取值,而不必通过FORM和BOM.追问
其实我就是想跨域名啊，在框架里面嵌套一个其他网站的表单
追答别费力气了,单靠JS是无法解决的,就算有后端支持,也是件很麻烦的事,要写很长的代码.
本回答被提问者和网友采纳 参考技术B 框架代码怎么会写到body里头去了，应该放到body外面，将body标签放到noframes标签里面，然后写上 $(window.frames['header'].document.body).html() 参考技术C 框架代码怎么会写到body里头去了，应该放到body外面，将body标签放到noframes标签里面，然后写上 $(window.frames['header'].document.body).html() 参考技术D 框架代码怎么会写到body里头去了，应该放到body外面，将body标签放到noframes标签里面，然后写上 $(window.frames['header'].document.body).html()如何用javascript 跨域获取iframe子页面的元素信息
跨域的话想用父页面的js获取iframe里的元素是不可能的。用chrome扩展程序的话是可以的。 参考技术A javascript获取iframe框架中，加载的页面document对象
因为浏览器安全限制，对跨域访问的页面，其document对象无法读取、设置属性
function getDocument(iframe)
var Doc;
try
Doc = iframe.contentWindow.document;// For IE5.5 and IE6
catch(ex)
if(!Doc)
Doc = iframe.contentDocument;// For NS6
return Doc;
用iframe嵌套页面是，如果父页面要获取子页面里面的内容，可以使用contentWindow或者contentDocument，其区别如下：
a>contentWindow 这是个只读属性，返回指定的iframe的窗口对象。它虽然不是标准的一部分，但各个主流浏览器都支持。
b>contentDocument Firefox 支持，IE6，IE7都不支持，IE8开始支持,需要如此访问 document.frames['J_mainframe'].document。
兼容获取document对象：
var getIFrameDoc = function()
var iobj = document.createElement("iframe");
document.getElementsByTagName("body")[0].appendChild(iobj);
return iobj.contentDocument || iobj.contentWindow.document;
本回答被提问者采纳
以上是关于javascript 如何获取iframe里面的内容？的主要内容，如果未能解决你的问题，请参考以下文章
javascript 控制 iframe 里面的 a 元素让它不跳出iframe