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 相关文章推荐
javascript 触发事件列表 比较不错
Sep 03 Javascript
jqgrid 编辑添加功能详细解析
Nov 08 Javascript
javascript中parentNode,childNodes,children的应用详解
Dec 17 Javascript
JavaScript格式化日期时间的方法和自定义格式化函数示例
Apr 04 Javascript
JS回调函数的应用简单实例
Sep 17 Javascript
让angularjs支持浏览器自动填表
Nov 10 Javascript
Javascript基础教程之break和continue语句
Jan 18 Javascript
原生js实现秒表计时器功能
Feb 16 Javascript
Bootstrap模态框插件使用详解
May 11 Javascript
JavaScript实现全选取消效果
Dec 14 Javascript
深入理解vue中slot与slot-scope的具体使用
Jan 26 Javascript
JavaScript数据结构与算法之二叉树实现查找最小值、最大值、给定值算法示例
Mar 01 Javascript
详谈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
基于preg_match_all采集后数据处理的一点心得笔记(编码转换和正则匹配)
2014/01/31 PHP
PHP 多进程与信号中断实现多任务常驻内存管理实例方法
2019/10/04 PHP
查询json的数据结构的8种方式简介
2014/03/10 Javascript
jquery基础教程之数组使用详解
2014/03/10 Javascript
在JavaScript中构建ArrayList示例代码
2014/09/17 Javascript
jquery实现焦点图片随机切换效果的方法
2015/03/12 Javascript
ES6中module模块化开发实例浅析
2017/04/06 Javascript
Javascript操作dom对象之select全面解析
2017/04/24 Javascript
vue组件生命周期详解
2017/11/07 Javascript
详解浏览器缓存和webpack缓存配置
2018/07/06 Javascript
vue 刷新之后 嵌套路由不变 重新渲染页面的方法
2018/09/13 Javascript
js中对象和面向对象与Json介绍
2019/01/21 Javascript
浅谈vue的第一个commit分析
2020/06/08 Javascript
JavaScript实现网页tab栏效果制作
2020/11/20 Javascript
[00:32]2016完美“圣”典风云人物:Maybe宣传片
2016/12/05 DOTA
Python中用format函数格式化字符串的用法
2015/04/08 Python
python冒泡排序简单实现方法
2015/07/09 Python
python编程使用selenium模拟登陆淘宝实例代码
2018/01/25 Python
opencv python 图像去噪的实现方法
2018/08/31 Python
关于 Python opencv 使用中的 ValueError: too many values to unpack
2019/06/28 Python
Python 从attribute到property详解
2020/03/05 Python
Python建造者模式案例运行原理解析
2020/06/29 Python
python使用matplotlib:subplot绘制多个子图的示例
2020/09/24 Python
Python绘制数码晶体管日期
2021/02/19 Python
快速实现一个简单的canvas迷宫游戏的示例
2018/07/04 HTML / CSS
香港个人化生活购物网站:Ballyhoo Limited
2016/09/10 全球购物
西班牙最好的在线购买葡萄酒的商店:Vinoseleccion
2019/10/30 全球购物
SQL Server笔试题
2012/01/10 面试题
师范生实习的个人自我鉴定
2013/10/20 职场文书
班风学风建设方案
2014/05/06 职场文书
英语分层教学实施方案
2014/06/15 职场文书
医院合作协议书
2014/08/19 职场文书
免职通知
2015/04/23 职场文书
行政答辩状范文
2015/05/21 职场文书
教师节主题班会教案
2015/08/17 职场文书
咖啡厅里的创业计划书
2019/08/21 职场文书