jquery 查找iframe父级页面元素的实现代码


Posted in Javascript onAugust 28, 2011

父页面代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>无标题文档</title> 
</head> 
<body> 
<div style="height:300px; background-color:#CC9900"></div> 
<div> 
<iframe src="test_iframe.html"></iframe> 
</div> 
</body> 
</html>

iframe页面代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>无标题文档</title> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script> 
$("body",parent.document).append('hahaha'); 
</script> 
</head> 
<body> 
iframe test--@mybest 
</body> 
</html>

 在jQuery的文档上有这样的记录:
jQuery(html, [ownerDocument])
参数
html String
用于动态创建DOM元素的HTML标记字符串

ownerDocument (可选) Document
创建DOM元素所在的文档

还是要多看,细看文档啊,真是所谓:书读百遍,其义自见啊!

------补记--------------------------

在测试时,发现chrome如何也不能实现上述要求,后来看到网上有人指出iframe不能跨域,这是问题之一,另一个原因是要放到一个站点中去测试

如:http://localhost:8087/test.html

这样chrome也就表现正常了

Javascript 相关文章推荐
jquery 弹出层注册页面等(asp.net后台)
Jun 17 Javascript
js获取对象为null的解决方法
Nov 21 Javascript
js如何判断用户是在PC端和还是移动端访问
Apr 24 Javascript
JS判断客服QQ号在线还是离线状态的方法
Jan 13 Javascript
详谈LABJS按需动态加载js文件
May 07 Javascript
bootstrap——bootstrapTable实现隐藏列的示例
Jan 14 Javascript
jquery实现左右轮播图效果
Sep 28 jQuery
详解Node使用Puppeteer完成一次复杂的爬虫
Apr 18 Javascript
如何让node运行es6模块文件及其原理详解
Dec 11 Javascript
微信小程序基于picker实现级联菜单
Feb 15 Javascript
详解JavaScript的内存空间、赋值和深浅拷贝
Apr 17 Javascript
JS实现百度搜索框关键字推荐
Feb 17 Javascript
基于jquery的多彩百分比 动态进度条 投票效果显示效果实现代码
Aug 28 #Javascript
一个JQuery写的点击上下滚动的小例子
Aug 27 #Javascript
JavaScript 原型继承之构造函数继承
Aug 26 #Javascript
JavaScript原型继承之基础机制分析
Aug 26 #Javascript
自己动手开发jQuery插件教程
Aug 25 #Javascript
JQuery里面的几种选择器 查找满足条件的元素$(&quot;#控件ID&quot;)
Aug 23 #Javascript
基于JQuery的Select选择框的华丽变身
Aug 23 #Javascript
You might like
set_include_path和get_include_path使用及注意事项
2013/02/02 PHP
php中get_meta_tags()、CURL与user-agent用法分析
2014/12/16 PHP
php生成4位数字验证码的实现代码
2015/11/23 PHP
Jquery右下角抖动、浮动 实例代码(兼容ie6、FF)
2013/08/15 Javascript
详解JavaScript的while循环的使用
2015/06/03 Javascript
JavaScript判断数组是否包含指定元素的方法
2015/07/01 Javascript
利用JavaScript脚本实现滚屏效果的方法
2015/07/07 Javascript
全面了解JavaScirpt 的垃圾(garbage collection)回收机制
2016/07/11 Javascript
对js中回调函数的一些看法
2016/08/29 Javascript
Angular ng-repeat指令实例以及扩展部分
2016/12/26 Javascript
Node.js中如何合并两个复杂对象详解
2016/12/31 Javascript
使用JS中的Replace()方法遇到的问题小结
2017/10/20 Javascript
AnglarJs中的上拉加载实现代码
2018/02/08 Javascript
vue实现条件判断动态绑定样式的方法
2018/09/29 Javascript
Vue中 v-if/v-show/插值表达式导致闪现的原因及解决办法
2018/10/12 Javascript
vue组件开发props验证的实现
2019/02/12 Javascript
vue如何截取字符串
2019/05/06 Javascript
Element图表初始大小及窗口自适应实现
2020/07/10 Javascript
原生JavaScript实现弹幕组件的示例代码
2020/10/12 Javascript
python通过pil模块将raw图片转换成png图片的方法
2015/03/16 Python
举例详解Python中循环语句的嵌套使用
2015/05/14 Python
python DataFrame 取差集实例
2019/01/30 Python
python pandas cumsum求累计次数的用法
2019/07/29 Python
详解opencv中画圆circle函数和椭圆ellipse函数
2019/12/27 Python
用python获取txt文件中关键字的数量
2020/12/24 Python
HTML5 3D书本翻页动画的实现示例
2019/08/28 HTML / CSS
北美领先的牛仔品牌:Buffalo David Bitton
2017/05/22 全球购物
西班牙香水和化妆品购物网站:Arenal Perfumerías
2019/03/01 全球购物
PHP中如何使用Cookie
2015/10/28 面试题
十一个高级MySql面试题
2014/10/06 面试题
党员目标管理责任书
2014/07/25 职场文书
学习焦裕禄同志为人民服务思想汇报
2014/09/10 职场文书
四风个人对照检查材料思想汇报(办公室通用版)
2014/10/07 职场文书
2015初中团委工作总结
2015/07/28 职场文书
go语言中切片与内存复制 memcpy 的实现操作
2021/04/27 Golang
vue2实现provide inject传递响应式
2021/05/21 Vue.js