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_11_constructor实现原理
Oct 18 Javascript
jquery ajax提交整个表单元素的快捷办法
Mar 27 Javascript
js取float型小数点后两位数的方法
Jan 18 Javascript
jQuery插件实现控制网页元素动态居中显示
Mar 24 Javascript
javascript制作的简单注册模块表单验证
Apr 13 Javascript
js自定义select下拉框美化特效
May 12 Javascript
解决Jquery下拉框数据动态获取的问题
Jan 25 jQuery
vue 中动态绑定class 和 style的方法代码详解
Jun 01 Javascript
jQuery 操作 HTML 元素和属性的方法
Nov 12 jQuery
Element实现表格分页数据选择+全选所有完善批量操作
Jun 07 Javascript
简谈创建React Component的几种方式
Jun 15 Javascript
vue添加自定义右键菜单的完整实例
Dec 08 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 透明水印生成代码
2012/08/27 PHP
在Z-Blog中运行代码[html][/html](纯JS版)
2007/03/25 Javascript
分享8款优秀的 jQuery 加载动画和进度条插件
2012/10/24 Javascript
jquery实现metro效果示例代码
2013/09/06 Javascript
jquery跟js初始化加载的多种方法及区别介绍
2014/04/02 Javascript
Javascript中对象继承的实现小例
2014/05/12 Javascript
js 动态修改css文件的方法
2014/08/05 Javascript
Vue.js实现一个自定义分页组件vue-paginaiton
2016/09/05 Javascript
JavaScript正则表达式替换字符串中图片地址(img src)的方法
2017/01/13 Javascript
通俗解释JavaScript正则表达式快速记忆
2017/08/23 Javascript
vue better-scroll插件使用详解
2018/01/25 Javascript
浅谈vue.js导入css库(elementUi)的方法
2018/03/09 Javascript
使用vue-route 的 beforeEach 实现导航守卫(路由跳转前验证登录)功能
2018/03/22 Javascript
Vue项目添加动态浏览器头部title的方法
2018/07/11 Javascript
js遍历详解(forEach, map, for, for...in, for...of)
2019/08/28 Javascript
js找出5个数中最大的一个数和倒数第二大的数实现方法示例小结
2020/03/04 Javascript
通过python下载FTP上的文件夹的实现代码
2013/02/10 Python
浅析python中的分片与截断序列
2016/08/09 Python
Python类的动态修改的实例方法
2017/03/24 Python
实例分析python3实现并发访问水平切分表
2018/09/29 Python
用Python+OpenCV对比图像质量的几种方法
2019/07/15 Python
Python使用matplotlib 模块scatter方法画散点图示例
2019/09/27 Python
详解PyQt5信号与槽的几种高级玩法
2020/03/24 Python
使用CSS3的font-face字体嵌入样式的方法讲解
2016/05/13 HTML / CSS
浅谈Html5多线程开发之WebWorkers
2018/05/02 HTML / CSS
中国最大的名表商城:万表网
2016/08/29 全球购物
教育学专业实习生的自我鉴定
2013/11/26 职场文书
大学生期末自我鉴定
2014/02/01 职场文书
运动会开幕式主持词
2014/03/28 职场文书
管理工程专业求职信
2014/08/10 职场文书
高中生自我评价范文2015
2015/03/03 职场文书
自荐信格式范文
2015/03/04 职场文书
党员带头倡议书
2015/04/29 职场文书
浪漫婚礼主持词开场白
2015/11/24 职场文书
合理缓解职场压力,让你随时保持最佳状态!
2019/06/21 职场文书
Anaconda配置各版本Pytorch的实现
2021/08/07 Python