1.什么是window.location? 示例
URL:http://b.a.com:88/index.php?name=kang&when=2016#first
属性 | 含义 | 值 |
---|---|---|
protocol: | 协议 | “http:” |
hostname: | 服务器的名字 | “b.a.com” |
port: | 端口 | “88” |
pathname: | URL中主机名后的部分 | “/index.php” |
search: | "?"后的部分,又称为查询字符串 | “?name=kang&when=2016” |
hash: | 返回"#"之后的内容 | “#first” |
host: | 等于hostname + port | “b.a.com:88” |
href: | 当前页面的完整URL | “http://www.a.com:88/index.php?name=kang&when=2016#first” |
window.location和document.location互相等价的,可以交换使用
location的8个属性都是可读写的,但是只有href与hash的写才有意义。例如改变location.href会重新定位到一个URL,而修改location.hash会跳到当前页面中的anchor(或者
等)名字的标记(如果有),而且页面不会被重新加载
注意
URL:http://b.a.com:88/index.php?name=kang&how=#when=2016#first
- search:"?name=kang&how=" 第一个"?"之后
- hash:"#when=2016#first" 第一个"#"之后的内容
2. 为什么 window.location.search 为空?
注意上面的search和hash的区别,如果URL中"?“之前有一个”#“比如:“http://localhost:63342/index.html#/version?type=35&id=5”, 那么使用window.location.search得到的就是空(”")。
因为"?type=35&id=5”串字符是属于"#/version?type=35&id=5"这个串字符的,也就是说查询字符串search只能在取到"?“后面和”#“之前的内容,如果”#“之前没有”?"search取值为空。
3. 应用
/**
* 解析URL传参
* @param {Object} key
*/
function getQueryString(key)
{
var after = window.location.search;
//如果url中没有传参直接返回空
if(after.indexOf('?') === -1) return null;
//key存在先通过search取值如果取不到就通过hash来取
after = after.substr(1) || window.location.hash.split("?")[1];
if(after)
{
var reg = new RegExp("(^|&)"+ key +"=([^&]*)(&|$)");
var r = after.match(reg);
if(r != null)
{
return decodeURIComponent(r[2]);
}
else
{
return null;
}
}
}
4. 微信小游戏
location.search
值为undefined的情况下,网页版本、Native版本、微信开发者工具都不报错,但是微信版本发到手机上直接跪,报如下错误<TypeError:undefined is not an object(evaluating 'e.indexof')>
:
TypeScript代码如下:
let zoneclass = Util.GetCurrentUrlParams("zoneclass");
/** 获取当前URL参数 */
public static GetCurrentUrlParams(key: string): string {
//这里url取到的是undefined
let url = location.search;
let urlParams = {};
if (url.indexOf("?") == 0) {
let str = url.substr(1);
let strs = str.split("&");
for (let i = 0; i < strs.length; i++) {
let params = strs[i].split("=")
urlParams[params[0]] = params[1];
}
}
return urlParams[key];
}