码迷,mamicode.com
首页 > Web开发 > 详细

利用 a 标签自动解析 url

时间:2016-09-06 18:15:31      阅读:142      评论:0      收藏:0      [点我收藏+]

标签:

很多时候,我们有从 url 中提取域名,查询关键字,变量参数值等的需求,然而我们可以让浏览器方便地帮助我们完成这一任务而不用写正则去抓取。方法就是先创建一个 a 标签然后将需要解析的 url 赋值给 a 的 href 属性,然后就得到了一切我们想要的了。

var a = document.createElement(‘a‘);
a.href = ‘http://zhuyujia.github.io/?a=1&b=2‘;
console.log(a.host);  // zhuyujia.github.io

利用这一原理,稍微扩展一下,就得到了一个更加完整的解析 url 各部分的通用方法了。

function parseUrl(url) {
    var a = document.createElement(‘a‘);
    a.href = url;
    return {
        source: url,
        protocol: a.protocol.replace(‘:‘, ‘‘),
        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;
        })(),
        file: (a.pathname.match(/\/([^\/?#]+)$/i) || [, ‘‘])[1],
        hash: a.hash.replace(‘#‘, ‘‘),
        path: a.pathname.replace(/^([^\/])/, ‘/$1‘),
        relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [, ‘‘])[1],
        segments: a.pathname.replace(/^\//, ‘‘).split(‘/‘)
    };
}

原文:http://zhuyujia.github.io/javascript/parsing-urls-with-the-dom.html

利用 a 标签自动解析 url

标签:

原文地址:http://www.cnblogs.com/yjzhu/p/5846603.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!