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 相关文章推荐
JS去除字符串的空格增强版(可以去除中间的空格)
Aug 26 Javascript
C#中TrimStart,TrimEnd,Trim在javascript上的实现
Jan 17 Javascript
js判断生效时间不得大于失效时间的思路及代码
Apr 23 Javascript
什么是Node.js?Node.js详细介绍
Jun 01 Javascript
js实现的黑背景灰色二级导航菜单效果代码
Aug 24 Javascript
js实现无缝滚动图(可控制当前滚动的方向)
Feb 22 Javascript
详解vue-router 2.0 常用基础知识点之router-link
May 10 Javascript
5分钟打造简易高效的webpack常用配置
Jul 04 Javascript
js实现图片放大并跟随鼠标移动特效
Jan 18 Javascript
JavaScript简易计算器制作
Jan 17 Javascript
js代码编写无缝轮播图
Sep 13 Javascript
vue中defineProperty和Proxy的区别详解
Nov 30 Vue.js
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解析字符串里所有URL地址的方法
2015/04/03 PHP
支付宝支付开发――当面付条码支付和扫码支付实例
2016/11/04 PHP
php 读写json文件及修改json的方法
2018/03/07 PHP
Yii框架小部件(Widgets)用法实例详解
2020/05/15 PHP
JQuery 应用 JQuery.groupTable.js
2010/12/15 Javascript
Js动态添加复选框Checkbox的实例方法
2013/04/08 Javascript
Jquery之Bind方法参数传递与接收的三种方法
2014/06/24 Javascript
Bootstrap风格的zTree右键菜单
2017/02/17 Javascript
BootStrap的两种模态框方式
2017/05/10 Javascript
jquery与js实现全选功能的区别
2017/06/11 jQuery
JavaScript实现短信倒计时60s
2017/10/09 Javascript
基于elementUI使用v-model实现经纬度输入的vue组件
2019/05/12 Javascript
js定义类的方法示例【ES5与ES6】
2019/07/30 Javascript
详谈python http长连接客户端
2017/06/12 Python
matplotlib在python上绘制3D散点图实例详解
2017/12/09 Python
两个元祖T1=('a', 'b'),T2=('c', 'd')使用匿名函数将其转变成[{'a': 'c'},{'b': 'd'}]的几种方法
2019/03/05 Python
Python中文分词库jieba,pkusegwg性能准确度比较
2020/02/11 Python
Django 自定义404 500等错误页面的实现
2020/03/08 Python
TensorFlow的环境配置与安装教程详解(win10+GeForce GTX1060+CUDA 9.0+cuDNN7.3+tensorflow-gpu 1.12.0+python3.5.5)
2020/06/22 Python
Numpy中np.max的用法及np.maximum区别
2020/11/27 Python
CSS3制作半透明边框(Facebox)类似渐变
2012/12/09 HTML / CSS
使用HTML5里的classList操作CSS类
2016/06/28 HTML / CSS
详解使用postMessage解决iframe跨域通信问题
2019/11/01 HTML / CSS
介绍一下Linux中的链接
2016/05/28 面试题
介绍一下Ruby的特点
2013/01/20 面试题
光盘行动倡议书
2014/02/02 职场文书
大学迎新晚会主持词
2014/03/24 职场文书
超市开业庆典活动策划方案
2014/09/15 职场文书
党员群众路线剖析材料
2014/10/08 职场文书
2015年计划生育责任书
2015/05/08 职场文书
员工辞职信范文大全
2015/05/12 职场文书
挂职锻炼工作总结2015
2015/05/28 职场文书
sql注入教程之类型以及提交注入
2021/08/02 MySQL
一文搞懂Python Sklearn库使用
2021/08/23 Python
详解JavaScript的计时器和按钮效果设置
2022/02/18 Javascript
Python matplotlib绘制条形统计图 处理多个实验多组观测值
2022/04/21 Python