jquery 查找iframe父级页面元素的实现代码
更新时间:2011年08月28日 17:37:24 作者:
jquery 查找iframe父级页面元素的实现代码,学习jquery的朋友可以参考下。
父页面代码
<!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也就表现正常了
复制代码 代码如下:
<!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也就表现正常了
相关文章
jQuery解决下拉框select设宽度时IE 6/7/8下option超出显示不全
jQuery解决IE 6/7/8 BUG:下拉框select设宽度时option超出显示不全,经过修改效果还不错,遇到类似情况的朋友可以参考下哈2013-05-05jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
cookie 是存储于访问者计算机中的变量。这篇文章主要介绍了jQuery利用cookie 实现本地收藏功能不重复无需多次命名,需要的朋友可以参考下2019-11-11formValidator3.3的ajaxValidator一些异常分析
ajaxvalidator是大家问的最多的问题,修正一个bug(感谢网友“じ龍峸√”),并把大家最关心的问题,再做一次阐述。2011-07-07
最新评论