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 调试利器 Firebug使用详解六
Jul 05 Javascript
JqGrid web打印实现代码
May 31 Javascript
JavaScript异步调用定时方法并停止该方法实现代码
Mar 16 Javascript
JavaSacript中charCodeAt()方法的使用详解
Jun 05 Javascript
JavaScript实现经典排序算法之插入排序
Dec 28 Javascript
微信小程序 实例开发总结
Apr 26 Javascript
js 简易版滚动条实例(适用于移动端H5开发)
Jun 26 Javascript
利用es6 new.target来对模拟抽象类的方法
May 10 Javascript
使用JQuery自动完成插件Auto Complete详解
Jun 18 jQuery
javascript实现超好看的3D烟花特效
Jan 01 Javascript
js获取本日、本周、本月的时间代码
Feb 01 Javascript
javascript利用canvas实现鼠标拖拽功能
Jul 23 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_MySQL教程-第一天
2007/03/18 PHP
php addslashes和mysql_real_escape_string
2010/01/24 PHP
PHP 将逗号、空格、回车分隔的字符串转换为数组的函数
2012/06/07 PHP
php遍历目录与文件夹的多种方法详解
2013/11/14 PHP
PHP xpath()函数讲解
2019/02/11 PHP
用JavaScript实现UrlEncode和UrlDecode的脚本代码
2008/07/23 Javascript
写得不错的jquery table鼠标经过变色代码
2013/09/27 Javascript
使用jQuery jqPlot插件绘制柱状图
2014/12/18 Javascript
Javascript动态创建div的方法
2015/02/09 Javascript
JavaScript判断字符长度、数字、Email、电话等常用判断函数分享
2015/04/01 Javascript
JS实现无限级网页折叠菜单(类似树形菜单)效果代码
2015/09/17 Javascript
JavaScript必看小技巧(必看)
2016/06/07 Javascript
设置cookie指定时间失效(实例代码)
2017/05/28 Javascript
jQuery实现动态添加节点与遍历节点功能示例
2017/11/09 jQuery
浅谈手写node可读流之流动模式
2018/06/01 Javascript
小程序实现留言板
2018/11/02 Javascript
vue下使用nginx刷新页面404的问题解决
2019/08/02 Javascript
ES6基础之字符串和函数的拓展详解
2019/08/22 Javascript
JavaScript基于用户照片姓名生成海报
2020/05/29 Javascript
Element Steps步骤条的使用方法
2020/07/26 Javascript
修改Vue打包后的默认文件名操作
2020/08/12 Javascript
python+selenium+autoit实现文件上传功能
2017/08/23 Python
python爬虫 使用真实浏览器打开网页的两种方法总结
2018/04/21 Python
python pandas库的安装和创建
2019/01/10 Python
解决新版Pycharm中Matplotlib图像不在弹出独立的显示窗口问题
2019/01/15 Python
css3 media 响应式布局的简单实例
2016/08/03 HTML / CSS
Pretty Little Thing美国:时尚女性服饰
2018/08/27 全球购物
施华洛世奇巴西官网:SWAROVSKI巴西
2019/12/03 全球购物
社区科普工作方案
2014/06/03 职场文书
毕业生银行实习自我鉴定
2014/10/14 职场文书
大明湖导游词
2015/02/03 职场文书
校运会加油稿大全
2015/07/22 职场文书
2019年家电促销广告语集锦
2019/10/21 职场文书
JavaScript 防篡改对象的用法示例
2021/04/24 Javascript
python 下划线的多种应用场景总结
2021/05/12 Python
MySQL分区表实现按月份归类
2021/11/01 MySQL