浅析location.href跨窗口调用函数
作者:逆心 发布时间:2024-04-17 09:41:37
location.href这个东西常常用于跳转,location既是window对象的属性,又是document对象的属性。
JavaScript hash 属性 -- 返回URL中#符号后面的内容
JavaScript host 属性 -- 返回域名
JavaScript hostname 属性 -- 返回主域名
JavaScript href 属性 -- 返回当前文档的完整URL或设置当前文档的URL
JavaScript pathname 属性 -- 返回URL中域名后的部分
JavaScript port 属性 -- 返回URL中的端口
JavaScript protocol 属性 -- 返回URL中的协议
JavaScript search 属性 -- 返回URL中的查询字符串
JavaScript assign() 函数 -- 设置当前文档的URL
JavaScript replace() 函数 -- 设置当前文档的URL,并在history对象的地址列表中删除这个URL
JavaScript reload() 函数 -- 重新载入当前文档
JavaScript toString() 函数 -- 返回location对象href属性当前的值
有几种不同的调用方法,弄到自己有点乱,这次一次性写个实例,完完全全不再混淆。本次用3个页面解决问题:
3.html 本窗口:
<html>
<head>
<title>js</title>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(function(){
$("#parent").click(function(){
parent.location.href = "https://www.aspxhome.com/article/97882.htm"; //父亲Iframe被跳转
})
$("#top").click(function(){
top.location.href = "https://www.aspxhome.com/article/97882.htm"; //爷爷Iframe(最外层)被跳转
})
$("#self").click(function(){
self.location.href = "https://www.aspxhome.com/article/97882.htm"; //自己跳转
})
$("#parentparent").click(function(){
parent.parent.location.href = "https://www.aspxhome.com/article/97882.htm"; //爷爷IFrame跳转,可以获取到任意层级的父窗口
})
})
function ParentRun()
{
alert("儿子IFrame方法!");
}
</script>
</head>
<body>
我是儿子!
<input type="button" id="parent" value="parent.location.href" />
<input type="button" id="top" value="top.location.href" />
<input type="button" id="self" value="self.location.href" />
<input type="button" id="parentparent" value="parentparent.location.href" />
</body>
</html>
2.html 父窗口:
<html>
<head>
<title>js??</title>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(function(){
$("#Outermost").click(function(){
//判断当前IFrame是否是最外层页面
if (top.location == self.location) {
alert("本Iframe是最外层框架");
}
else{
alert("本Iframe不是最外层框架"); //这个被弹出
}
})
$("#Son").click(function(){
//window.frames[0].location = "https://www.aspxhome.com/article/97882.htm";
window.frames["Son"].location = "https://www.aspxhome.com/article/97882.htm";
})
$("#SonFunction").click(function(){
window.frames["Son"].ParentRun(); //IE支持,google发布后)支持(文件系统中不支持)
})
$("#ParentFunction").click(function(){
parent.SonRun(); //IE支持,google发布后支持(文件系统中不支持)
})
})
</script>
</head>
<body>
我是父亲!
<iframe src="3.html" name="Son" style="width:300px; height:300px;" ></iframe>
<input type="button" id="Outermost" value="判断当前IFrame是否最外层" />
<input type="button" id="Son" value="控制儿子IFrame跳转" />
<input type="button" id="SonFunction" value="调用子窗口函数">
<input type="button" id="ParentFunction" value="调用父窗口函数">
</body>
</html>
1.html 爷窗口:
<html>
<head>
<title>js</title>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(function(){
alert(window.location == document.location); //输出 true
})
function SonRun()
{
alert("爷爷IFrame方法!");
}
//http://localhost:666/1.html?id=1&name=%E5%BC%A0%E4%B8%89#menu
document.write(location.hash + "<br/>"); // #menu
document.write(location.host + "<br/>"); // localhost:666
document.write(location.hostname + "<br/>"); // localhost
document.write(location.pathname + "<br/>"); // /1.html
document.write(location.port + "<br/>"); // 666
document.write(location.protocol + "<br/>"); // http:
document.write(location.search + "<br/>"); // ?id=1&name=%E5%BC%A0%E4%B8%89
document.write(location.assign + "<br/>"); // function () { [native code] }
</script>
</head>
<body>
我是最爷爷(最外层)!
<iframe src="2.html" style="width:500px; height:500px;" ></iframe>
</body>
</html>
三个页面放在同一个目录,随便点下就知道怎么回事了!
jQuery对IFrame的操作主要是通过
$("iframe").contents().find("#id1");
进行跨IFrame操作。
来源:http://www.cnblogs.com/kissdodog/p/3412866.html
猜你喜欢
- 1.分析 我们在用 php 制作网站时,分类是很重要的,在分类下面又再分类这第二个分类称为次分类,而现在大多
- 介绍与创建型模式类似,工厂模式创建对象(视为工厂里的产品)时无需指定创建对象的具体类。工厂模式定义一个用于创建对象的接口,这个接口由子类决定
- SQL Server 2000使得以XML导出数据变得更加简单,但在SQL Server 2000中导入XML数据并对其进行处理则有些麻烦。
- eval函数就是实现list、dict、tuple与str之间的转化str函数把list,dict,tuple转为为字符串一、字符串转换成列
- 本文实例为大家分享了OpenCV+face++实现实时人脸识别解锁功能的具体代码,供大家参考,具体内容如下1.背景最近做一个小东西,需要登录
- 本文实例讲述了JS简单获取并修改input文本框内容的方法。分享给大家供大家参考,具体如下:一 介绍获取文本框并修改其内容可以使用getEl
- 这篇论坛文章(赛迪网技术社区)主要介绍了配置一个高可用性的MySQL服务器负载均衡群集的具体过程,详细内容请参考下文:本文将告诉你如何配置一
- 现在小编已经学习语言程序良久,但是在了解以后,如果让小编再去学习语言要入手入口,一定是先从掌握函数开始了解,原因很简单,任何一个代码串都是有
- 前言在使用echarts绘图时可能遇到一些特别的需求,如,当x周表示日期且数据较多(如三个月,按天统计),此时如果按照echarts的默认配
- unplugin-auto-import的配置和eslint报错解决先上官网:unplugin-auto-importunplugin-au
- 三种遍历列表里面序号和值的方法:最近学习python这门语言,感觉到其对自己的工作效率有很大的提升,特在情人节这一天写下了这篇博客,下面废话
- 本文实例讲述了Python中@property的理解和使用。分享给大家供大家参考,具体如下:重看狗书,看到对User表定义的时候有下面两行
- 调度和锁定在很多客户一起查询数据表时,如果使客户能最快地查询到数据就是调度和锁定做的工作了。在MySQL中,我们把select操作叫做读,把
- @property有什么用呢?表面看来,就是将一个方法用属性的方式来访问.上代码,代码最清晰了.class Circle(object):
- 常见到网上博文有错误理论,包括身边很多朋友都曾认同“可访问性(Accessibility)是为残障人士准备”的观点。其实在互联网技术领域远不
- <?php interface js{ function ys($a,$b); } class Af implements js{ f
- 本文实例讲述了python实现计算资源图标crc值的方法,分享给大家供大家参考。具体方法如下:实现该功能的关键在于解析资源信息,找到icon
- 先看看弹窗效果,如下: //放大图片 $(page).on('click','.popupIm
- 事件是将JavaScript脚本与网页联系在一起的主要方式,是JavaScript中最重要的主题之一,深入理解事件的工作机制以及它们对性能的
- 最近媳妇工作上遇到一个重复性劳动,excel表格查重,重复的标记起来,问我能不能写个程序让它自动查重标记必须安排第一次正儿八经写python