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_01_isPlainObject分析与重构
Oct 20 Javascript
JS模拟自动点击的简单实例
Aug 08 Javascript
js数组的操作指南
Dec 28 Javascript
详解WordPress开发中get_current_screen()函数的使用
Jan 11 Javascript
实例详解AngularJS实现无限级联动菜单
Jan 15 Javascript
总结JavaScript的正则与其他语言的不同之处
Aug 25 Javascript
Ajax与服务器(JSON)通信实例代码
Nov 05 Javascript
Angularjs中使用指令绑定点击事件的方法
Mar 30 Javascript
EL表达式截取字符串的函数说明
Sep 22 Javascript
JS计算输出100元钱买100只鸡问题的解决方法
Jan 04 Javascript
javascript获取图片的top N主色值方法详解
Jan 26 Javascript
Vue-router中hash模式与history模式的区别详解
Dec 15 Vue.js
基于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
我的论坛源代码(二)
2006/10/09 PHP
php中XMLHttpRequest(Ajax)不能设置自定义的Referer的解决方法
2011/11/26 PHP
浅谈PHP中new self()和new static()的区别
2017/08/11 PHP
ThinkPHP 在阿里云上的nginx.config配置实例详解
2017/10/11 PHP
javascript中解析四则运算表达式的算法和示例
2014/08/11 Javascript
Javascript中this的用法详解
2014/09/22 Javascript
每天一篇javascript学习小结(基础知识)
2015/11/10 Javascript
莱鸟介绍window.print()方法
2016/01/06 Javascript
javascript获取select标签选中的值
2016/06/04 Javascript
浅谈DOM的操作以及性能优化问题-重绘重排
2017/01/08 Javascript
canvas实现十二星座星空图
2017/02/14 Javascript
基于Vue 2.0的模块化前端 UI 组件库小结
2017/12/21 Javascript
ReactNative实现Toast的示例
2017/12/31 Javascript
vue调试工具vue-devtools安装及使用方法
2018/11/07 Javascript
vue-router 控制路由权限的实现
2020/09/24 Javascript
[03:04]DOTA2超级联赛专访ZSMJ “莫名其妙”的逆袭
2013/05/23 DOTA
使用scrapy实现爬网站例子和实现网络爬虫(蜘蛛)的步骤
2014/01/23 Python
python根据经纬度计算距离示例
2014/02/16 Python
Python中列表和元组的使用方法和区别详解
2020/12/30 Python
Python中文编码知识点
2019/02/18 Python
Python使用字典的嵌套功能详解
2019/02/27 Python
django url到views参数传递的实例
2019/07/19 Python
Jupyter notebook无法导入第三方模块的解决方式
2020/04/15 Python
python 错误处理 assert详解
2020/04/20 Python
详解pyinstaller生成exe的闪退问题解决方案
2020/06/19 Python
Python使用文件操作实现一个XX信息管理系统的示例
2020/07/02 Python
使用Python解析Chrome浏览器书签的示例
2020/11/13 Python
Python3+Flask安装使用教程详解
2021/02/16 Python
介绍JAVA 中的Collection FrameWork(及如何写自己的数据结构)
2014/10/31 面试题
红领巾心向党广播稿
2014/01/19 职场文书
学生会招新策划书
2014/02/14 职场文书
工作散漫检讨书
2014/09/16 职场文书
1000字打架检讨书
2014/11/03 职场文书
2014年图书管理员工作总结
2014/12/01 职场文书
mysql 索引合并的使用
2021/08/30 MySQL
IDEA中sout快捷键无效问题的解决方法
2022/07/23 Java/Android