javascript 获取iframe页面中元素的值

发布时间:2020-07-09编辑:脚本学堂
javascript如何获取iframe页面中元素的值,这里分享一种方法,有需要的朋友参考下。

IE方法:
document.frames['myFrame'].document.getElementById('test').value;
火狐方法:
document.getElementById('myFrame').contentWindow.document.getElementById('test').value;
IE、火狐方法:
 

复制代码 代码示例:

   function getValue(){

         var tmp = '';

         if(document.frames){

     tmp += 'ie哥说:';

     tmp += document.frames['myFrame'].document.getElementById('test').value;

         }else{

     tmp = document.getElementById('myFrame').contentWindow.document.getElementById('test').value;

         }

         alert(tmp);

    }

示例代码:
a.html页面中的代码
 

复制代码 代码示例:
<html>
 <head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     <title>
         javascript 获取iframe里页面中元素的值_www.jb200.com</title>
</head>
<body>
     <iframe id="myFrame" src='b.html' style="width:300px;height: 50px;"></iframe>
     <input type="button" id="btn" onclick="getValue()" value="test" >
     <script type="text/javascript">
  function getValue(){
      var tmp = '';
      if(document.frames){
   tmp += 'ie哥说:';
   tmp += document.frames['myFrame'].document.getElementById('test').value;
      }else{
   tmp = document.getElementById('myFrame').contentWindow.document.getElementById('test').value;
      }
      alert(tmp);
  }
     </script>
 </body>
        </html>

b.html页面代码
 

复制代码 代码示例:
<html>
 <head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     <title>我是 iframe内的页面</title>
 </head>
 <body>
     <input type='text' id="test" value='欢迎访问:www.jb200.com'>
 </body>
</html>