time 
设为首页】【收藏本站
当前位置: 主页 > WEB教程 > Html教程 > 访问多层iframe的方法示例

访问多层iframe的方法示例

时间:2012-11-25 23:31 点击:622次 字体:[ ]




注意:

一、等iframe里面的文件加载完才可以访问;

二、contentDocument ie6/7不支持;所以采用了contentWindow.document。如果不兼容这两个可以用

  document.getElementById("myframe").contentDocument.getElementById("bframe").contentDocument.getElementById('test').innerHTML;

三、top.frames["myframe"].frames["bframe"].document.getElementById('test').innerHTML这种方式最短了,看起来很爽的样子。

四、访问iframe的window和document在chrome里有安全限制的,上传到服务器上测试;

a.html

  1. <!DOCTYPE HTML> 
  2. <html> 
  3. <head> 
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
  5. <title>无标题文档</title> 
  6.      <script> 
  7.             function t(){  
  8.                 alert(document.getElementById("myframe").contentWindow.document.getElementById("bframe").contentWindow.document.getElementById('test').innerHTML);  
  9.                 //alert(top.frames["myframe"].frames["bframe"].document.getElementById('test').innerHTML);  
  10.             }  
  11.     </script> 
  12. </head> 
  13.  
  14. <body> 
  15.     <input name="" value="tttt" onClick="t()" type="button"> 
  16.     <div id="get" style="height:30px;width:600px;border:1px solid #69F"></div> 
  17.     <iframe id="myframe" name="myframe" src="b.html" width="600" height="500"></iframe> 
  18. </body> 
  19. </html> 

b.html

  1. <!DOCTYPE HTML> 
  2. <html> 
  3. <head> 
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
  5. <title>无标题文档</title> 
  6. </head> 
  7.  
  8. <body> 
  9.     <iframe id="bframe" name="bframe" src="c.html" width="600" height="500"></iframe> 
  10. </body> 
  11. </html> 

c.html

  1. <!DOCTYPE HTML> 
  2. <html> 
  3. <head> 
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
  5. <title>无标题文档</title> 
  6. </head> 
  7.  
  8. <body> 
  9. <div id="test">1233333</div> 
  10. </body> 
  11. </html> 

 



本文地址 : http://www.fengfly.com/plus/view-210453-1.html
标签: iframe
------分隔线----------------------------
最新评论 查看所有评论
发表评论 查看所有评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
验证码: