jquery 父页面查找iframe子页面内容、子页面查找父页面内容

发布时间:2020-04-29编辑:脚本学堂
分享一例jquery代码,实现在父页面中查找iframe子页面中的内容,并且子页面可以查找父页面内容,有需要的朋友参考下。

1,父页面代码
 

复制代码 代码示例:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>jquery 父页面查找iframe子页面内容-www.jb200.com</title>
<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
</head>
<body>
    <div class="f_div">父页面内容</div>
 <iframe name='if1' src="1.html" width="300" height="400"></iframe>
    <script>
     $(function(){
   $('iframe').load(function(){ //确保子页面完成加载
    alert($('iframe').contents().find('.c_div').html());
                                alert($('.c_div',window.frames["if1"].document).html());//另一方法
   });
   
  });
    </script>
</body>
</html>

2,子页面代码
 

复制代码 代码示例:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>子页面查找父页面内容-www.jb200.com</title>
<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
</head>
<body>
<div class="c_div">子页面内容</div>
<script>
$(function(){
   alert($('.f_div',parent.document).html());   
});
</script>
</body>
</html>