Jquery方式获取iframe页面中的 Dom元素
程序员文章站
2022-07-07 23:46:39
测试页面代码：
. 代码如下:
jquery方式，访问iframe页面dom元素</...</div>
<div class="content">
测试页面代码：<br><p class="codetitle"><span onclick="doCopy('code72141')" style="CURSOR: pointer"><u>.</u></span> 代码如下:</p>
<p class="codebody" id="code72141"><br>
<html><br>
<head><br>
<title>jquery方式，访问iframe页面dom元素</title><br>
<meta name="Author" content="孙勤波"><br>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /><br>
<script type="text/javascript" src="https://s1.bdstatic.com/r/www/cache/static/jquery/jquery-1.10.2.min_f2fb5194.js"></script><br>
<script type="text/javascript"><br>
function getIframeDom(){<br>
// 获取iframe的test元素<br>
var test = $("#frame_1").contents().find("#test");<br>
alert(test.html())<br>
}<br>
</script><br>
</head><br>
<body><br>
<iframe src="file:///C:/Users/SUN/AppData/Local/Temp/non9C34.htm" id="frame_1"></iframe><br>
<br /><br>
<a href="javascript：getIframeDom();">获取iframe 页面test元素内容</a><br>
</body><br>
</html></p>
<br>
test.html 页面代码<br><p class="codetitle"><span onclick="doCopy('code63855')" style="CURSOR: pointer"><u>.</u></span> 代码如下:</p>
<p class="codebody" id="code63855"><br>
<html><br>
<head><br>
<title>iframe页面a.html</title><br>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /><br>
</head><br>
<body><br>
<p id="test">我是测试页面test</p><br>
</body><br>
</html></p>
<br>
点击测试按钮效果：<br><img onerror="this.src='/statics/superweb999/images/image_error.jpg'"alt="Jquery方式获取iframe页面中的 Dom元素" src="/default/index/img?u=aHR0cDovL2ltYWdlczIuMTBxaWFud2FuLmNvbS8xMHFpYW53YW4vMjAxODA0MDQvYl8wXzIwMTgwNDA0MDExODUzNTk2Ni5qcGc=" style="width: 289px; height: 451px;" title="Jquery方式获取iframe页面中的 Dom元素"> </div>
<div class="info-pre-next">
<p>
上一篇： <a href="/article/1680885.html">
JS中window.close()方法无法关闭谷歌的问题讲解 </a>
</p>
<p>
下一篇： <a href="/article/1680887.html">
html5 canvas入门帖 </a>
</p>
</div>
<div class="wz_tuijian">
<p>
推荐阅读 </p>
<ul>
<li>
<a href="/article/2072002.html" target="_blank" title="jQuery 获取/设置/删除DOM元素的属性以a元素为例">
<h2>
jQuery 获取/设置/删除DOM元素的属性以a元素为例 </h2>
</a>
</li>
<li>
<a href="/article/2046857.html" target="_blank" title="Web API---DOM---总结获取元素的方式">
<h2>
Web API---DOM---总结获取元素的方式 </h2>
</a>
</li>
<li>
<a href="/article/2040588.html" target="_blank" title="在vue中获取dom元素内容的方法">
<h2>
在vue中获取dom元素内容的方法 </h2>
</a>
</li>
<li>
<a href="/article/2019353.html" target="_blank" title="关于dom获取元素的几种方式">
<h2>
关于dom获取元素的几种方式 </h2>
</a>
</li>
<li>
<a href="/article/2004197.html" target="_blank" title="jQuery中获取Radio元素值的方法">
<h2>
jQuery中获取Radio元素值的方法 </h2>
</a>
</li>
<li>
<a href="/article/1994499.html" target="_blank" title="JQuery 获取Dom元素的实例讲解">
<h2>
JQuery 获取Dom元素的实例讲解 </h2>
</a>
</li>
<li>
<a href="/article/1973741.html" target="_blank" title="iframe子页面获取父页面元素的方法">
<h2>
iframe子页面获取父页面元素的方法 </h2>
</a>
</li>
<li>
<a href="/article/1972757.html" target="_blank" title="Android Manifest中meta-data扩展元素数据的配置与获取方式">
<h2>
Android Manifest中meta-data扩展元素数据的配置与获取方式 </h2>
</a>
</li>
<li>
<a href="/article/1892049.html" target="_blank" title="Layer获取iframe的dom元素及调用iframe页的js方法详解">
<h2>
Layer获取iframe的dom元素及调用iframe页的js方法详解 </h2>
</a>
</li>
<li>
<a href="/article/1866943.html" target="_blank" title="在js中获取页面元素的属性值时,弱类型导致的诡异事件踩坑记录,">
<h2>
在js中获取页面元素的属性值时,弱类型导致的诡异事件踩坑记录, </h2>
</a>
</li>
</ul>
</div>
</article>
</div>
</main>
<footer><div class="box"><div class="ft_nav"><div class="ft_about"><p>关于网站</p><ul><li><a href="/sitemap.xml" target="_blank" title="网站地图">网站地图</a></li><li><a href="/list/2/" title="最新程序员文章站">最新程序员文章站</a></li></ul></div><div class="ft_contact"><ul><li>本站所有数据收集于网络如有侵犯到您的权益，请联系我们进行下架处理。</li><li class="email_show"></li></ul></div></div><div class="copyright"><div class="cr_left"><p> 备案号：<a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">粤ICP备20058927号</a></p><p>© Copyright © 2020-2022 www.superweb999.com 程序员文章站. </p></div></div></div></footer> </body>
</html>