知识大全关于Javascript与iframe的那些事儿

Posted 2022-07-20 知

篇首语：会挽雕弓如满月，西北望，射天狼。本文由小常识网(cha138.com)小编为大家整理，主要介绍了知识大全关于Javascript与iframe的那些事儿相关的知识，希望对你有一定的参考价值。

关于Javascript与iframe的那些事儿 以下文字资料是由(全榜网网www.cha138.com)小编为大家搜集整理后发布的内容，让我们赶快一起来看一下吧！

　　嵌入 iframe 的页面父页面与子页面均可以很轻松的在同域或跨子域的情况下进行读写操作在完全不同域的情况下也可以通过更改 hash 的方式进行通信下面我在九个不同（版本的）浏览器中对此进行数据传输与更改的兼容性测试 同域或跨子域读写操作 iframe 里的内容 父页面读写操作子页面

复制代码代码如下: <iframe id="test iframe" name=test iframe src=child scrolling="no" frameborder=" "></iframe> <script> window onload = function () /* * 下面两种获取节点内容的方式都可以 * 由于 IE IE 不支持 contentDocument 属性所以此处用了通用的 * window frames["iframe Name"] or window frames[index] */ var d = window frames["test iframe"] document; d getElementsByTagName( h )[ ] innerHTML = pp ; alert(d getElementsByTagName( h )[ ] firstChild data); </script>

　　注在请务必通过 window onload 方法访问 iframe 中的节点否则浏览器会提示错误拒绝访问在 IE Firefox Opera 下在DOMReady 时也可以访问 iframe 中的节点子页面读写操作父页面

复制代码代码如下: <script> parent document getElementsByTagName( h )[ ] innerHTML = pp ; alert(parent document getElementsByTagName( h )[ ] firstChild data); </script>

　　小结 • 测试通过 IE IE IE Firefox Firefox Firefox Chrome Opera Safari • 查阅资料得出 document getElementById(‘id name ) contentDocument 全等于 window frames["iframe Name"] document • 跨子域时需要在父页面和子页面 JS 中分别加上 document domain = xxx ; 跨域操作 iframe 里内容 当两个网页所在域不同时要实现数据的互相调用只能通过 JS 改变 location 对象的 hash 属性的值来做到互相通信父页面

复制代码代码如下: <iframe id="test iframe" src= scrolling="no" frameborder=" "></iframe> <input type=button value="send" onclick="sendRequest()" /> <script> function sendRequest() document getElementById( test iframe ) src += #a ; var interval = window setInterval(function() if(location hash) alert(location hash); window clearInterval(interval); ); </script>

　　子页面

复制代码代码如下: <h >RRRRRR</h > <script> var url = ; oldHash = self location hash newHash interval = window setInterval(function() newHash = self location hash; if(oldHash != self location hash) document getElementsByTagName( h )[ ] innerHTML = pp ; //alert(parent location href); //去掉这个注释浏览器会提示无权限 parent location href = url + #b ; window clearInterval(interval); ); </script> cha138/Article/program/Java/JSP/201311/20053

知识大全 关于Javascript与iframe的那些事儿

知识大全关于Javascript与iframe的那些事儿