一 作用
- 提供了当前窗口中加载文档的信息,以及通常的导航功能
- 既是window的属性,也是document的属性
- 保存着当前加载文档的信息
- 保存把URL解析为离散片段后能够通过属性访问的信息
二 属性
三 方法
查询字符串
- 方法:location.search
- 返回:返回了从问号开始直到URL末尾的所有内容
程序实现:解析查询字符串
实现一:
1、解析后的参数将被保存到args对象,这个对象以字面量形式创建
2、把查询字符串按照&分割成数组,每个元素的形式为name=value
3、for循环将每一个元素按照=分割成数组,数组第一项是参数名,第二项是参数值
4、参数名和参数值通过decodeURIComponent()解码后保存到name和value变量中
5、name作为属性 value作为该属性的值被添加到args对象
let getQueryStringArgs = function() {
// 取得没有开头问号的查询字符串
let qs = (location.search.length > 0 ? location.search.substring(1): "");
// 保存数据的对象
let args = {};
// 把每个参数添加到args对象
for(let item of qs.split("&").map(kv => kv.split('='))) {
let name = decodeURIComponent(item[0]);
let value = decodeURIComponent(item[1]);
if(name.length){
args[name] = value;
}
}
return args;
}
实现二:使用URLSearchParams构造函数
参数:一个查询字符串
可作为可迭代对象
实例方法: get() set() delete()
let qs = '?q=javascript&num=10';
let searchParams = new URLSearchParams(qs);
console.log(searchParams);//searchParams: URLSearchParams { 'q' => 'javascript', 'num' => '10' }
console.log(searchParams.toString());//q=javascript&num=10
//查询是否有某个参数
searchParams.has('num');//true
searchParams.get('num');//10
//添加某个参数
searchParams.set("page", "3");
console.log(searchParams.toString());//q=javascript&num=10&page=3
//删除某个参数
searchParams.delete("page");
console.log(searchParams.toString());//q=javascript&num=10
for(let param of searchParams){
console.log('param: ', param);
// param: [ 'q', 'javascript' ]
// param: [ 'num', '10' ]
}
操作地址
方法一:location.assign(URL)
方法二:window.location = URL
方法三:location.href = URL
方法四:location.replace()
方法五:location.reload()
除了hash之后,修改location的其他属性的其中一个,就会导致页面重新加载新URL