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 相关文章推荐
区分JS中的undefined,null,&quot;&quot;,0和false
Mar 08 Javascript
基于Asp.net与Javascript控制的日期控件
May 22 Javascript
JavaScript.Encode手动解码技巧
Jul 14 Javascript
JQuery与JSon实现的无刷新分页代码
Sep 13 Javascript
模拟jQuery中的ready方法及实现按需加载css,js实例代码
Sep 27 Javascript
Vue.js第二天学习笔记(vue-router)
Dec 01 Javascript
JS中Safari浏览器中的Date
Jul 17 Javascript
总结js中的一些兼容性易错的问题
Dec 18 Javascript
vue项目中运用webpack动态配置打包多种环境域名的方法
Jun 24 Javascript
vue实现整屏滚动切换
Jun 29 Javascript
Vue实现input宽度随文字长度自适应操作
Jul 29 Javascript
vue实现一个获取按键展示快捷键效果的Input组件
Jan 13 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自动跳转中英文页面
2008/07/29 PHP
PHP中几种常见的超时处理全面总结
2012/09/11 PHP
PHP把小数转成整数3种方法
2014/06/30 PHP
Yii中CGridView实现批量删除的方法
2015/12/28 PHP
Yii框架函数简单用法分析
2019/09/09 PHP
javascript jQuery插件练习
2008/12/24 Javascript
基于JQuery的多标签实现代码
2012/09/19 Javascript
jquery div 居中技巧应用介绍
2012/11/24 Javascript
js 控制下拉菜单刷新的方法
2013/03/03 Javascript
jQuery 淡入淡出 png图在ie8下有黑色边框的解决方法
2013/03/05 Javascript
JavaScript实现字符串与日期的互相转换及日期的格式化
2016/03/07 Javascript
javascript的列表切换【实现代码】
2016/05/03 Javascript
js 弹出虚拟键盘修改密码的简单实例
2016/10/10 Javascript
深入理解jquery的$.extend()、$.fn和$.fn.extend()
2017/07/08 jQuery
JavaScript函数的特性与应用实践深入详解
2018/12/30 Javascript
vue-cli4.x创建企业级项目的方法步骤
2020/06/18 Javascript
Python实现简单HTML表格解析的方法
2015/06/15 Python
Python数据类型详解(三)元祖:tuple
2016/05/08 Python
简单了解Python中的几种函数
2017/11/03 Python
flask中主动抛出异常及统一异常处理代码示例
2018/01/18 Python
pyqt5 从本地选择图片 并显示在label上的实例
2019/06/13 Python
python将数组n等分的实例
2019/12/02 Python
关于Pytorch MaxUnpool2d中size操作方式
2020/01/03 Python
基于python实现模拟数据结构模型
2020/06/12 Python
python3从网络摄像机解析mjpeg http流的示例
2020/11/13 Python
Python3中FuzzyWuzzy库实例用法
2020/11/18 Python
HTML5单页面手势滑屏切换原理分析
2017/07/10 HTML / CSS
英国潮流网站:END.(全球免邮)
2017/01/16 全球购物
毕业生自我鉴定实例
2014/01/21 职场文书
《大禹治水》教学反思
2014/04/27 职场文书
自习课吵闹检讨书范文
2014/09/26 职场文书
中学生检讨书范文
2014/11/03 职场文书
岗位职责范本大全
2015/02/26 职场文书
自荐信格式模板
2015/03/27 职场文书
整改通知书
2015/04/20 职场文书
《我的长生果》教学反思
2016/02/20 职场文书