JS序列化URL方法

function serializeUrl(str){
    var param = {}, hash = {}, anchor;
    var url = str || location.href;
    var arr = /([^?]*)([^#]*)(.*)/.exec(url);
    var ar1 = /(.*:)?(?:\/?\/?)([\.\w]*)(:\d*)?(.*?)([^\/]*)$/.exec(arr[1]);
    var ar2 = arr[2].match(/[^?&=]*=[^?&=]*/g);
    var ar3 = arr[3].match(/[^#&=]*=[^#&=]*/g);

    if(ar2){
        for(var i = 0, l = ar2.length; i < l; i++){
            var ar22 = /([^=]*)(?:=*)(.*)/.exec(ar2[i]);
            param[ar22[1]] = ar22[2];
        }
    }

    if(ar3){
        for(var i = 0, l = ar3.length; i < l; i++){
            var ar33 = /([^=]*)(?:=*)(.*)/.exec(ar3[i]);
            hash[ar33[1]] = ar33[2];
        }
    }

    if(arr[3] && !/[=&]/g.test(arr[3])){
        anchor = arr[3];
    }

    function getUrl(){
        var that = this, url = [], param = [], hash = [];

        url.push(that.protocol, that.protocol && ‘//‘ || ‘‘, that.host, that.port, that.path, that.file);

        for(var p in that.param){
            param.push(p+ ‘=‘ +that.param[p]);
        }

        for(var p in that.hash){
            hash.push(p+ ‘=‘ +that.hash[p]);
        }

        url.push(param.length && ‘?‘ + param.join(‘&‘) || ‘‘);

        if(that.anchor){
            url.push(that.anchor);
        }else{
            url.push(hash.length && ‘#‘ + hash.join(‘&‘) || ‘‘);
        }

        return url.join(‘‘);
    }

    return {
        href: arr[0],
        protocol: ar1[1],
        host: ar1[2],
        port: (ar1[3] || ‘‘),
        path: ar1[4],
        file: ar1[5],
        param: param,
        hash: hash,
        anchor: anchor,
        getUrl: getUrl
    };
};
举例:serializeUrl(‘http://www.baidu.com:80/fuwu_bone/html/orderlist.html?a=1&b=2#c=3‘)

返回结果:

{
  "href": "http://www.baidu.com:80/fuwu_bone/html/orderlist.html?a=1&b=2#c=3",
  "protocol": "http://www.baidu.com:",
  "host": "80",
  "port": "",
  "path": "/fuwu_bone/html/",
  "file": "orderlist.html",
  "param": {
    "a": "1",
    "b": "2"
  },
  "hash": {
    "c": "3"
  }
}

时间: 2024-11-10 07:15:37

JS序列化URL方法的相关文章

JS获取URL中参数值(QueryString)的4种方法

在某书上看到这道题目,查找解题思路后做了部分解析,如有错误请指正 方法一:正则法 代码如下: function getQueryString(name) {    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i'); //匹配指定name的QueryString    var r = window.location.search.substr(1).match(reg); //window.location.sea

js获取url的参数和值的N种有效方法

js获取url的参数和值的N种有效方法 function getParameterByName(name) { name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]"); var regexS = "[\\?&]" + name + "=([^&#]*)"; var regex = new RegExp(regexS); var results =

js获取url传值的方法

这篇文章主要介绍了js获取url传值的方法,实例分析了字符串分割与正则分析两种方法,并补充了一个基于正则匹配实现的js获取url的get传值函数,需要的朋友可以参考下 js获取url参数值: index.htm?参数1=数值1&参数2=数值2&参数3=数据3&参数4=数值4&...... 静态html文件js读取url参数 根据获取html的参数值控制html页面输出 一.字符串分割分析法 这里是一个获取URL带QUESTRING参数的JAVASCRIPT客户端解决方案,相

JS获取URL中参数值(QueryString)的4种方法分享

http://www.jb51.net/article/48942.htm JS获取URL中参数值(QueryString)的4种方法分享 作者: 字体:[增加 减小] 类型:转载 今天碰到要在一个页面获取另外一个页面url传过来的参数,一开始很本能的想到了用 split("?")这样一步步的分解出需要的参数.后来想了一下,肯定会有更加简单的方法的!所以在网上找到了几个很又简单实用的方法,mark下. 方法一:正则法 复制代码 代码如下: function getQueryString

JQuery 加载 CSS、JS 文件的方法有哪些?

在进行web前端开发(http://www.maiziedu.com/course/web-px/)时,我们可能会需要使用JQuery加载一个外部的css文件或者js文件,加载外部文件的方法有多种,下面具体看看各种加载方法 JS 方式加载 CSS.JS 文件: //加载 css 文件function includeCss(filename) { var head = document.getElementsByTagName('head')[0]; var link = document.cre

js获取url链接中的参数

js获取url链接中的参数:url传递参数这是常识,这里就不多介绍了,既然传递参数就要获取参数的值,下面就介绍一下如何实现此功能.代码如下: function request(paras){ var url="softwhy.com?a=1&b=2"; var paraString=url.substring(url.indexOf("?")+1,url.length).split("&"); var paraObj={} for

【javascript】js 获取 url 后的参数值

以前写过一篇类似的博文(提取 url 的搜索字符串中的参数),但是个人觉得使用起来不是很方便,今天抽空重新写了个函数,该函数代码更加简洁. //获取 url 后的参数值 function getUrl(para){ var paraArr = location.search.substring(1).split('&'); var paraObj = {}; for(var i = 0;k = paraArr[i];i++){ paraObj[k.substring(0,k.indexOf('=

异步加载js文件的方法总结

方法一,jQuery.getScript HTML 代码: 代码如下 复制代码 <button id="go">Run</button><div class="block"></div> jQuery 代码: jQuery.getScript("http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js", function(){ $

js刷新页面方法大全

本文介绍下,用js刷新当前页面的几种方法,包括reload方法.replace方法.自动刷新方法等.有需要的朋友参考下吧 如何实现刷新当前页面呢?借助js你将无所不能. 1,reload 方法,该方法强迫浏览器刷新当前页面.语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页.true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新") 2,replace 方法