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中的类型和对象
Nov 29 Javascript
jQuery中bind,live,delegate与one方法的用法及区别解析
Dec 30 Javascript
原生javascript获取元素样式
Dec 31 Javascript
使用jquery动态加载Js文件和Css文件
Oct 24 Javascript
AJAX和jQuery动态加载数据的实现方法
Dec 05 Javascript
浅谈react.js 之 批量添加与删除功能
Apr 17 Javascript
JS原生轮播图的简单实现(推荐)
Jul 22 Javascript
Vue2.0 组件传值通讯的示例代码
Aug 01 Javascript
解决layer弹层遮罩挡住窗体的问题
Aug 17 Javascript
详解Express笔记之动态渲染HTML(新手入坑)
Dec 13 Javascript
Vue通过for循环随机生成不同的颜色或随机数的实例
Nov 09 Javascript
JS实现可视化音频效果的实例代码
Jan 16 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
新版mysql+apache+php Linux安装指南
2006/10/09 PHP
PHPnow安装服务[apache_pn]失败的问题的解决方法
2010/09/10 PHP
php 面试碰到过的问题 在此做下记录
2011/06/09 PHP
php保存信息到当前Session的方法
2015/03/16 PHP
PHP加密解密类实例代码
2016/07/20 PHP
Laravel中间件实现原理详解
2016/10/09 PHP
走出JavaScript初学困境—js初学
2008/12/29 Javascript
JS分页效果示例
2013/10/11 Javascript
判断字符串的长度(优化版)中文占两个字符
2014/10/30 Javascript
JavaScript中的console.dir()函数介绍
2014/12/29 Javascript
原生javascript实现图片弹窗交互效果
2015/01/12 Javascript
4种JavaScript实现简单tab选项卡切换的方法
2016/01/06 Javascript
javascript鼠标右键菜单自定义效果
2020/12/08 Javascript
AngularJS ng-bind-template 指令详解
2016/07/30 Javascript
jQGrid Table操作列中点击【操作】按钮弹出按钮层的实现代码
2016/12/05 Javascript
使用imba.io框架得到比 vue 快50倍的性能基准
2019/06/17 Javascript
bootstrap 日期控件 datepicker被弹出框dialog覆盖的解决办法
2019/07/09 Javascript
vue element实现表格合并行数据
2020/11/30 Vue.js
JavaScript实现10秒后再次获取验证码
2020/12/02 Javascript
python3中的md5加密实例
2018/05/29 Python
Python自然语言处理 NLTK 库用法入门教程【经典】
2018/06/26 Python
你正在寻找的CSS3 动画技术
2011/07/27 HTML / CSS
纯css实现照片墙3D效果的示例代码
2017/11/13 HTML / CSS
美国汽配连锁巨头Pep Boys官网:轮胎更换、汽车维修服务和汽车零部件
2017/01/14 全球购物
美国环保妈妈、儿童和婴儿用品购物网站:The Tot
2019/11/24 全球购物
Python面试题:Python是如何进行内存管理的
2014/08/04 面试题
毕业生文员求职信
2013/11/03 职场文书
个人教师自我评价范文
2013/12/02 职场文书
保护水资源的标语
2014/06/17 职场文书
大学学生个人总结
2015/02/15 职场文书
放假通知格式
2015/04/14 职场文书
文员岗位职责范本
2015/04/16 职场文书
初一数学教学反思
2016/02/17 职场文书
写作指导:怎么书写竞聘演讲稿?
2019/07/04 职场文书
告诉你创业计划书的8个实用技巧
2019/07/12 职场文书
Win11任务栏太宽了怎么办?一招解决Win11任务栏太宽问题
2021/11/21 数码科技