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 相关文章推荐
用正则xmlHttp实现的偷(转)
Jan 22 Javascript
JS获得QQ号码的昵称,头像,生日的简单实例
Dec 04 Javascript
JavaScript获取网页中第一个链接ID的方法
Apr 03 Javascript
15款最好的Bootstrap在线编辑器
Aug 03 Javascript
vue 引入公共css文件的简单方法(推荐)
Jan 20 Javascript
Element-ui table中过滤条件变更表格内容的方法
Mar 02 Javascript
解决vue+webpack打包路径的问题
Mar 06 Javascript
JS实现关键词高亮显示正则匹配
Jun 22 Javascript
ES6 系列之 WeakMap的使用示例
Aug 06 Javascript
Vue Autocomplete 自动完成功能简单示例
May 25 Javascript
在Vue环境下利用worker运行interval计时器的步骤
Aug 01 Javascript
八种Vue组件间通讯方式合集(推荐)
Aug 18 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
php自动获取关键字的方法
2015/01/06 PHP
php判断一个数组是否为有序的方法
2015/03/27 PHP
实例讲解yii2.0在php命令行中运行的步骤
2015/12/01 PHP
PHP信号量基本用法实例详解
2016/02/12 PHP
ThinkPHP5.1验证码功能实现的示例代码
2020/06/08 PHP
自适应高度框架 ----属个人收藏内容
2007/01/22 Javascript
各种效果的jquery ui(接口)介绍
2008/09/17 Javascript
JavaScript中__proto__与prototype的关系深入理解
2012/12/04 Javascript
javascript的渐进增强与平稳退化浅谈
2013/11/12 Javascript
JavaScript中创建字典对象(dictionary)实例
2015/03/31 Javascript
基于jquery实现动态竖向柱状条特效
2016/02/12 Javascript
AngularJS 中文API参考手册
2016/07/28 Javascript
分享19个JavaScript 有用的简写写法
2017/07/07 Javascript
关于vue-resource报错450的解决方案
2017/07/24 Javascript
three.js中文文档学习之通过模块导入
2017/11/20 Javascript
详解基于electron制作一个node压缩图片的桌面应用
2019/01/29 Javascript
解决Layui当中的导航条动态添加后渲染失败的问题
2019/09/25 Javascript
JS实现点击下拉列表文本框中出现对应的网址,点击跳转按钮实现跳转
2019/11/25 Javascript
Vue替代marquee标签超出宽度文字横向滚动效果
2019/12/09 Javascript
详解webpack-dev-middleware 源码解读
2020/03/23 Javascript
[01:08:48]LGD vs OG 2018国际邀请赛淘汰赛BO3 第三场 8.25
2018/08/29 DOTA
Python自动连接ssh的方法
2015/03/07 Python
python os.path.isfile 的使用误区详解
2019/11/29 Python
手动安装python3.6的操作过程详解
2020/01/13 Python
Python3 用matplotlib绘制sigmoid函数的案例
2020/12/11 Python
HTML5图片预览实例分享
2014/06/04 HTML / CSS
全球销量第一生发产品:Viviscal
2017/12/21 全球购物
马来西亚在线购物市场:PGMall.my
2019/10/13 全球购物
俄罗斯韩国化妆品网上商店:Cosmasi.ru
2019/10/31 全球购物
GOLFINO英国官网:高尔夫服装
2020/04/11 全球购物
毕业生个人求职信范例分享
2013/12/17 职场文书
大学校务公开实施方案
2014/03/31 职场文书
祖国在我心中演讲稿400字
2014/05/04 职场文书
创文明城市标语
2014/06/16 职场文书
计算机应用专业自荐信
2014/07/05 职场文书
2015年护士长个人工作总结
2015/04/24 职场文书