JavaScript window.location对象


Posted in Javascript onNovember 14, 2014

经常使用window.location,它的结构总是记不住,简单梳理下,方便以后查询。

示例
URL:http://b.a.com:88/index.php?name=kang&when=2011#first

属性 含义
protocol: 协议 "http:"
hostname: 服务器的名字 "b.a.com"
port: 端口 "88"
pathname: URL中主机名后的部分 "/index.php"
search: "?"后的部分,又称为查询字符串 "?name=kang&when=2011"
hash: 返回"#"之后的内容 "#first"
host: 等于hostname + port "b.a.com:88"
href: 当前页面的完整URL "http://www.a.com:88/index.php?name=kang&when=2011#first"

window.location和document.location互相等价的,可以交换使用

location的8个属性都是可读写的,但是只有href与hash的写才有意义。例如改变location.href会重新定位到一个URL,而修改location.hash会跳到当前页面中的anchor(<a id="name">或者<div id="id">等)名字的标记(如果有),而且页面不会被重新加载

注意
URL:http://b.a.com:88/index.php?name=kang&how=#when=2011#first

search: "?name=kang&how=" 第一个"?"之后
hash: "#when=2011#first" 第一个"#"之后的内容
search:"?name=kang&how="第一个"?"之后
hash:"#when=2011#first"第一个"#"之后的内容

方法

location.assign( url )
location.assign('http://www.baidu.com'); 等同于 window.location = 'http://www.baidu.com'
这种方式会讲新地址放到浏览器历史栈中,意味着转到新页面后“后退按钮”仍可以回到该页面。
location.replace( url )
与assign方法一样,但会从浏览器历史栈中删除本页面,也就是说跳转到新页面后“后退按钮”不能回到该页面。目前IE、Chrome只是简单的跳转,只有Firefox会删除本页面的历史记录。
location.reload( force )
重新载入当前页面。force为true时从服务器端重载;false则从浏览器缓存中重载,默认值false。

Javascript 相关文章推荐
将字符串转换成gb2312或者utf-8编码的参数(js版)
Apr 10 Javascript
jQuery的deferred对象详解
Nov 12 Javascript
浅谈javascript中基本包装类型
Jun 03 Javascript
七个不允许错过的jQuery小技巧
Dec 21 Javascript
jQuery获得字体颜色16位码的方法
Feb 20 Javascript
js实时获取窗口大小变化的实例代码
Nov 18 Javascript
AngularJS实现进度条功能示例
Jul 05 Javascript
js简单遍历获取对象中的属性值的方法示例
Jun 19 Javascript
vue实现设置载入动画和初始化页面动画效果
Oct 28 Javascript
vue Tab切换以及缓存页面处理的几种方式
Nov 05 Javascript
JavaScript如何实现监听键盘输入和鼠标监点击
Jul 20 Javascript
Vue如何实现变量表达式选择器
Feb 18 Vue.js
详谈JavaScript 匿名函数及闭包
Nov 14 #Javascript
详谈JavaScript内存泄漏
Nov 14 #Javascript
js与C#进行时间戳转换
Nov 14 #Javascript
jquery ui bootstrap 实现自定义风格
Nov 14 #Javascript
使用node.js 制作网站前台后台
Nov 13 #Javascript
JavaScript 作用域链解析
Nov 13 #Javascript
jQuery $命名冲突解决方案汇总
Nov 13 #Javascript
You might like
修改php.ini实现Mysql导入数据库文件最大限制的修改方法
2007/12/11 PHP
PHP设计模式 注册表模式
2012/02/05 PHP
基于ubuntu下nginx+php+mysql安装配置的具体操作步骤
2013/04/28 PHP
PHP 中 Orientation 属性判断上传图片是否需要旋转
2015/10/16 PHP
PHP连接MySQL进行增、删、改、查操作
2017/02/19 PHP
yii2的restful api路由实例详解
2019/05/14 PHP
JavaScript高级程序设计(第3版)学习笔记13 ECMAScript5新特性
2012/10/11 Javascript
jquery select多选框的左右移动 具体实现代码
2013/07/03 Javascript
jQuery中:header选择器用法实例
2014/12/29 Javascript
jQuery表单域属性过滤器用法分析
2015/02/10 Javascript
jQuery选择器用法实例详解
2015/12/17 Javascript
js获取上传文件的绝对路径实现方法
2016/08/02 Javascript
JS简单获取及显示当前时间的方法
2016/08/03 Javascript
Vue.js组件tree实现无限级树形菜单
2016/12/02 Javascript
AngularJS模糊查询功能实现代码(过滤内容下拉菜单排序过滤敏感字符验证判断后添加表格信息)
2017/10/24 Javascript
Angular2实现组件交互的方法分析
2017/12/19 Javascript
angular4 共享服务在多个组件中数据通信的示例
2018/03/30 Javascript
解决vue js IOS H5focus无法自动弹出键盘的问题
2018/08/30 Javascript
详解关于webpack多入口热加载很慢的原因
2019/04/24 Javascript
微信小程序如何再次获取用户授权的方法
2019/05/10 Javascript
es6数组之扩展运算符操作实例分析
2020/04/25 Javascript
js实现星星打分效果
2020/07/05 Javascript
python通过线程实现定时器timer的方法
2015/03/16 Python
Python绘制KS曲线的实现方法
2018/08/13 Python
Python 二叉树的层序建立与三种遍历实现详解
2019/07/29 Python
Python中包的用法及安装
2020/02/11 Python
jupyter notebook tensorflow打印device信息实例
2020/04/20 Python
matplotlib对象拾取事件处理的实现
2021/01/14 Python
HTML5中5个简单实用的API(第二篇,含全屏、可见性、拍照、预加载、电池状态)
2014/05/07 HTML / CSS
澳大利亚运动鞋零售商:The Athlete’s Foot
2018/11/04 全球购物
技校生自我鉴定
2013/12/08 职场文书
教导处教学工作总结
2015/08/12 职场文书
改进工作作风心得体会
2016/01/23 职场文书
工作汇报材料难写?方法都在这里了!
2019/07/01 职场文书
导游词之任弼时故居
2020/01/07 职场文书
深入浅析Django MTV模式
2021/09/04 Python