一、Location 对象
window.location 对象用于获得当前页面的地址 (URL),并把浏览器重定向到新的页面。
二、属性hash和search的区别
属性 | 描述 |
---|---|
location.hash | 设置或返回一个URL的锚部分(从 # 号开始的部分)。 |
location.search | 设置或返回一个URL的查询部分(从 ? 开始的部分)。 |
1、示例1,url中#
在?
后面: https://blog.csdn.net/article?id=94458654#first
属性 | 结果 |
---|---|
location.hash | '#first' |
location.search | '?id=94458654' 。注意:不包含#后面的内容 |
2、示例2,url中#
在?
前面: https://blog.csdn.net/article#first?id=94458654
属性 | 结果 |
---|---|
location.hash | '#first?id=94458654' 。注意:包含?后面的内容 |
location.search | '' 。值为空 |
三、为什么 location.search 会为空
在「示例2」中,因为?id=94458654
是属于location.hash
的内容,可以理解为这一部分内容先被location.hash
取走了,location.search
再取值就取不到了。
四、解决
/**
* @description 获取url参数
* @param {String} name 参数名,不传则返回所有参数的对象
* @return {String Object}
*/
function getParams(name) {
var search = window.location.search.substring(1)
if (!search) {
search = window.location.hash.split('?')[1]
}
if (search) {
var obj = JSON.parse('{"' + decodeURIComponent(search).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g, '":"') + '"}')
return name ? obj[name] : obj
}
}
以上示例调用结果:
getParams() // 返回:{id: '94458654'}
getParams('id') // 返回:'94458654'