Jquery方式获取iframe页面中的 Dom元素


Posted in Javascript onMay 07, 2014

测试页面代码:

<html> 
<head> 
<title>jquery方式,访问iframe页面dom元素</title> 
<meta name="Author" content="孙勤波"> 
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> 
<script type="text/javascript" src="http://s1.bdstatic.com/r/www/cache/static/jquery/jquery-1.10.2.min_f2fb5194.js"></script> 
<script type="text/javascript"> 
function getIframeDom(){ 
// 获取iframe的test元素 
var test = $("#frame_1").contents().find("#test"); 
alert(test.html()) 
} 
</script> 
</head> 
<body> 
<iframe src="file:///C:/Users/SUN/AppData/Local/Temp/non9C34.htm" id="frame_1"></iframe> 
<br /> 
<a href="javascript:getIframeDom();">获取iframe 页面test元素内容</a> 
</body> 
</html>

test.html 页面代码
<html> 
<head> 
<title>iframe页面a.html</title> 
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> 
</head> 
<body> 
<div id="test">我是测试页面test</div> 
</body> 
</html>

点击测试按钮效果:
Jquery方式获取iframe页面中的 Dom元素
Javascript 相关文章推荐
Javascript操作select方法大全[新增、修改、删除、选中、清空、判断存在等]
Sep 26 Javascript
jquery对象和DOM对象的区别介绍
Aug 09 Javascript
javascript避免数字计算精度误差的方法详解
Mar 05 Javascript
Javascript Memoizer浅析
Oct 16 Javascript
Bootstrap Metronic完全响应式管理模板之菜单栏学习笔记
Jul 08 Javascript
如何使用Vuex+Vue.js构建单页应用
Oct 27 Javascript
Vue2.0如何发布项目实战
Jul 27 Javascript
微信小程序之前台循环数据绑定
Aug 18 Javascript
vue使用pdfjs显示PDF可复制的实现方法
Dec 14 Javascript
javascript设计模式 ? 代理模式原理与用法实例分析
Apr 16 Javascript
解决Echarts2竖直datazoom滑动后显示数据不全的问题
Jul 20 Javascript
vue 子组件修改data或调用操作
Aug 07 Javascript
HTML页面弹出居中可拖拽的自定义窗口层
May 07 #Javascript
js获取select默认选中的Option并不是当前选中值
May 07 #Javascript
iframe子页面与父页面在同域或不同域下的js通信
May 07 #Javascript
jquery文本框中的事件应用以输入邮箱为例
May 06 #Javascript
jquery删除数据记录时的弹出提示效果
May 06 #Javascript
js单词形式的运算符
May 06 #Javascript
js函数调用的方式
May 06 #Javascript
You might like
无数据库的详细域名查询程序PHP版(4)
2006/10/09 PHP
基于Zend的Captcha机制的应用
2013/05/02 PHP
又一个PHP实现的冒泡排序算法分享
2014/08/21 PHP
php的sso单点登录实现方法
2015/01/08 PHP
thinkPHP和onethink微信支付插件分享
2019/08/11 PHP
最好用的省市二级联动 原生js实现你值得拥有
2013/09/22 Javascript
刷新页面的几种方法小结(JS,ASP.NET)
2014/01/07 Javascript
JavaScript对象的property属性详解
2014/04/01 Javascript
javascript实现table选中的行以指定颜色高亮显示的方法
2015/05/13 Javascript
javascript框架设计之框架分类及主要功能
2015/06/23 Javascript
Bootstrap表单布局
2016/07/19 Javascript
JavaScript中push(),join() 函数 实例详解
2016/09/06 Javascript
Flask中获取小程序Request数据的两种方法
2017/05/12 Javascript
vue权限路由实现的方法示例总结
2018/07/29 Javascript
create-react-app安装出错问题解决方法
2018/09/04 Javascript
iview Upload组件多个文件上传的示例代码
2018/09/30 Javascript
在博客园博文中添加自定义右键菜单的方法详解
2020/02/05 Javascript
Python中利用Scipy包的SIFT方法进行图片识别的实例教程
2016/06/03 Python
Python针对给定列表中元素进行翻转操作的方法分析
2018/04/27 Python
用Django写天气预报查询网站
2018/10/21 Python
如何通过python画loss曲线的方法
2019/06/26 Python
python实现控制COM口的示例
2019/07/03 Python
Python和Sublime整合过程图示
2019/12/25 Python
基于canvas使用贝塞尔曲线平滑拟合折线段的方法
2018/01/10 HTML / CSS
阿根廷旅游网站:almundo阿根廷
2018/02/12 全球购物
亿企通软件测试面试题
2012/04/10 面试题
机电工程专业应届生求职信
2013/10/03 职场文书
日语专业推荐信
2013/11/12 职场文书
医学专业自荐信
2014/06/14 职场文书
十佳家长事迹材料
2014/08/26 职场文书
离婚协议书范文
2015/01/26 职场文书
前台岗位职责
2015/02/13 职场文书
二婚主持词
2015/06/30 职场文书
2016应届毕业生自荐信范文
2016/01/28 职场文书
遇事可以测出您的见识与格局
2019/09/16 职场文书
html2 canvas svg不能识别的解决方案
2021/06/03 HTML / CSS