Heim  >  Artikel  >  Web-Frontend  >  Verwenden Sie ein Tag, um URL-Beispiele für die URL-Analyse automatisch zu analysieren_Javascript-Kenntnisse

Verwenden Sie ein Tag, um URL-Beispiele für die URL-Analyse automatisch zu analysieren_Javascript-Kenntnisse

WBOY
WBOYOriginal
2016-05-16 16:33:181501Durchsuche

对于window.location,我们比较熟悉,它有protocol,hostname,host,port,search,hash,href,pathname等属性,a标签也和window.location一样,也有这样属性,这样可以方便我们分析网址,闲话少说,上代码。

function parseURL(url) {
var a = document.createElement('a');
a.href = url;
return {
source: url,
protocol: a.protocol.replace(':',''),
host: a.hostname,
port: a.port||'80',
query: a.search,
params: (function(){
var ret = {},
seg = a.search.replace(/^\?/,'').split('&'),
len = seg.length, i = 0, s;
for (;i<len;i++) {
if (!seg[i]) { continue; }
s = seg[i].split('=');
ret[s[0]] = s[1];
}
return ret;
})(),
file: (a.pathname.match(/\/([^\/&#63;#]+)$/i) || [,''])[1],
hash: a.hash.replace('#',''),
path: a.pathname.replace(/^([^\/])/,'/$1'),
relative: (a.href.match(/tps&#63;:\/\/[^\/]+(.+)/) || [,''])[1],
segments: a.pathname.replace(/^\//,'').split('/')
};
}

测试地址

console.log(parseURL("http://www.w3school.com.cn/jsref/dom_obj_anchor.asp?type=2#id2"));

结果如下

复制代码 代码如下:

{
file: "dom_obj_anchor.asp",
hash: "id2",
host: "www.w3school.com.cn",
params: {type: "2"},
path: "/jsref/dom_obj_anchor.asp",
port: "80",
protocol: "http",
query: "?type=2",
relative: "/jsref/dom_obj_anchor.asp?type=2#id2",
segments: [0: "jsref",1: "dom_obj_anchor.asp"],
source: http://www.w3school.com.cn/jsref/dom_obj_anchor.asp?type=2#id2
}

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn