1 个有趣的 JS 特性

利用 a 标签解析 URL

• 有的时候我们需要从一个 URL 中提取域名，查询关键字，变量参数值等，一般我们会自己去解析 URL 来获取这些内容。可是你或许不知道还有更简单的方法。 即创建一个 a 标签将需要解析的 URL 赋值给 a 的 href 属性，然后我们就能很方便的拿到这些内容。代码如下：

function parseURL(url) {
    var a =  document.createElement('a');
    a.href = url;
    return {
        host: a.hostname,
        port: a.port,
        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;
        })(),
        hash: a.hash.replace('#','')
    };
}

console.log(parseURL("https://www.google.com/search?q=blank%3Aabout&oq=blank%3Aabout&aqs=chrome..69i57j69i58.7687j0j1&sourceid=chrome&ie=UTF-8"))
hash: ""
host: "www.google.com"
params: {q: "blank%3Aabout", oq: "blank%3Aabout", aqs: "chrome..69i57j69i58.7687j0j1", sourceid: "chrome", ie: "UTF-8"}
port: ""
query: "?q=blank%3Aabout&oq=blank%3Aabout&aqs=chrome..69i57j69i58.7687j0j1&sourceid=chrome&ie=UTF-8"
__proto__: Object