zoukankan      html  css  js  c++  java
  • 利用a标签解析URL

    参考资料

    http://www.cnblogs.com/Wayou/p/things_you_dont_know_about_frontend.html

    很多时候我们有从一个URL中提取域名,查询关键字,变量参数值等的需要,可以通过正则自己解析,但比较麻烦,我们可以让浏览器帮我们完成这一任务。

    方法

    方法就是在JS代码里先创建一个a标签然后将需要解析的URL赋值给a的href属性,然后就得到了一切我们想要的了。

    var a = document.createElement('a');
     a.href = 'http://www.cnblogs.com/wayou/p/';
     console.log(a.host);

    扩展

    利用上述方法,可以实现一个更健壮的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('/')
        };
    }
  • 相关阅读:
    nuxt实践
    安卓H5软键盘遮挡输入框
    h5复制粘贴板,打开APP功能
    MVC3
    MVC3
    C#高编
    接口的显式实现(转)
    E-Retail 框架学习
    C#高编
    实现DIV居中布局三种途径(转)
  • 原文地址:https://www.cnblogs.com/z-sm/p/5166656.html
Copyright © 2011-2022 走看看