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 相关文章推荐
javascript学习随笔(使用window和frame)的技巧
Mar 08 Javascript
js单例模式的两种方案
Oct 22 Javascript
js 去掉空格实例 Trim() LTrim() RTrim()
Jan 07 Javascript
原生js结合html5制作简易的双色子游戏
Mar 30 Javascript
使用微信小程序开发前端【快速入门】
Dec 05 Javascript
jquery横向纵向鼠标滚轮全屏切换
Feb 27 Javascript
js上下视差滚动简单实现代码
Mar 07 Javascript
一步步教你利用webpack如何搭一个vue脚手架(超详细讲解和注释)
Jan 08 Javascript
angular 内存溢出的问题解决
Jul 12 Javascript
微信小程序发送短信验证码完整实例
Jan 07 Javascript
用原生 JS 实现 innerHTML 功能实例详解
Apr 03 Javascript
详解Vue之事件处理
Jul 10 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文件读写操作之文件读取方法详解
2011/01/13 PHP
php中将汉字转换成拼音的函数代码
2012/09/08 PHP
不同浏览器的怪癖小结
2010/07/11 Javascript
jQuery ajax(复习)—Baidu ajax request分离版
2013/01/24 Javascript
json格式的时间显示为正常年月日的方法
2013/09/08 Javascript
javascript贪吃蛇完整版(源码)
2013/12/09 Javascript
判断window.onload是否多次使用的方法
2014/09/21 Javascript
jQuery实现的在线答题功能
2015/04/12 Javascript
ECMAScript6函数剩余参数(Rest Parameters)
2015/06/12 Javascript
快速解决js开发下拉框中blur与click冲突
2016/10/10 Javascript
vue.js绑定class和style样式(6)
2016/12/09 Javascript
用jQuery实现优酷首页轮播图
2017/01/09 Javascript
详解用vue编写弹出框组件
2017/07/04 Javascript
详解webpack3如何正确引用并使用jQuery库
2017/08/26 jQuery
微信小程序实现下拉刷新和轮播图效果
2017/11/21 Javascript
微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码
2018/11/09 Javascript
Node.js assert断言原理与用法分析
2019/01/04 Javascript
vue中上传视频或图片或图片和文字一起到后端的解决方法
2019/12/01 Javascript
Vue学习笔记之计算属性与侦听器用法
2019/12/07 Javascript
JavaScript Html实现移动端红包雨功能页面
2021/01/10 Javascript
rhythmbox中文名乱码问题解决方法
2008/09/06 Python
Python求导数的方法
2015/05/09 Python
Django 生成登陆验证码代码分享
2017/12/12 Python
在pandas中一次性删除dataframe的多个列方法
2018/04/10 Python
python3使用SMTP发送简单文本邮件
2018/06/19 Python
Windows下安装Scrapy
2018/10/17 Python
pandas 使用均值填充缺失值列的小技巧分享
2019/07/04 Python
HelloFresh澳大利亚:订购你的美味食品盒、健康餐食
2018/03/28 全球购物
NFL Game Pass欧洲:在线观看NFL比赛直播和点播,以高清质量播放
2018/08/30 全球购物
一套Delphi的笔试题二
2013/05/11 面试题
党课学习思想汇报
2014/01/02 职场文书
面临毕业的毕业生自荐书范文
2014/02/05 职场文书
2014年个人委托书范本
2014/10/13 职场文书
JS不要再到处使用绝对等于运算符了
2021/04/30 Javascript
Python常遇到的错误和异常
2021/11/02 Python
WCG2010 星际争霸决赛 Flash vs Goojila 1 星际经典比赛回顾
2022/04/01 星际争霸