大涛子客栈

Purl.js可以帮助我们来获取地址栏的一些信息, 可以使用原生js,也可以使用jQuery

AttributesInfo
sourceThe whole url being parsed
protocoleg. http, https, file, etc
hosteg. www.mydomain.com, localhost etc
porteg. 80
relativeThe relative path to the file including the querystring (eg. /folder/dir/index.html?item=value)
pathThe path to the file (eg. /folder/dir/index.html)
directoryThe directory part of the path (eg. /folder/dir/)
fileThe basename of the file eg. index.html
queryThe entire query string if it exists, eg. item=value&item2=value2
fragment or anchorThe entire string after the # symbol

初始化:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
var url;
var myurl;

$("#clickBtn").find('button').click(function(e) {
var res, resInfo;

myurl = $("#urlArea").val();
// 如果myurl为空,则会获取当前页面的url
url = purl(myurl);

$("#urlArea").val(myurl);

res = $(this).text();
resInfo = getUrlInfo(url, res);

$("#inputRes").val(resInfo);
});

function getUrlInfo(url, res) {
if (res === 'param') {
return url.param();
} else if (res === 'segment') {
return url.segment();
} else {
return url.attr(res);
}
}

运行试试看:

截图如下所示:

截图

记录在QDfuns:

 评论