js取url参数

经常用到js取url的参数,记下来。

function getUrlParam(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
    var r = window.location.search.substr(1).match(reg);  //匹配目标参数
    if (r != null) return unescape(r[2]); return null; //返回参数值
}

刚看到笑看风云写的JavaScript面向对象(极简主义法)和一个分解url参数面试题,我作了一下修改,记录下来!!!

修改前:

View Code
<script type="text/javascript">
    var url="www.taobao.com?key0=a&key1=b&key2=c";
    
    function parseQueryString(url){
        var str=url.split("?")[1],
            items=str.split("&");
        var arr,name,value;
        for(var i = 0, l = items.length; i < l; i++){
            arr=items[i].split("=");
            name= arr[0];
            value= arr[1];
            this[name]=value;
        }
    }
    var obj=new parseQueryString(url);
    alert(obj.key1)
</script>

修改后:

<script type="text/javascript">
    var url="www.taobao.com?key0=a&key1=b&key2=c";
    var pQString={
        createNew:function(url){
            var str=url.split("?")[1],
                items=str.split("&");
            var arr,name,value;
            for(var i = 0, l = items.length; i < l; i++){
                arr=items[i].split("=");
                name= arr[0];
                value= arr[1];
                this[name]=value;
            }
        }
    }

    var obj=new pQString.createNew(url);
    alert(obj.key1)
</script>

 -----------------------------------------------------------------------------

 感谢  草根程序猿很厉害把这个方法重写了一下,更严密,高效了,最后面在些再学习一下!!!

<script type="text/javascript">
function getQueryString(url) { 
    if(url) { 
        url=url.substr(url.indexOf("?")+1); //字符串截取,比我之前的split()方法效率高
    } 
    var result = {}, //创建一个对象,用于存name,和value
        queryString =url || location.search.substring(1), //location.search设置或返回从问号 (?) 开始的 URL(查询部分)。 
        re = /([^&=]+)=([^&]*)/g, //正则,具体不会用
        m; 
   
   while (m = re.exec(queryString)) { //exec()正则表达式的匹配,具体不会用 
        result[decodeURIComponent(m[1])] = decodeURIComponent(m[2]); //使用 decodeURIComponent() 对编码后的 URI 进行解码
   } 
   
   return result; 
} 
   
// demo 
var myParam = getQueryString("www.taobao.com?key0=a&key1=b&key2=c"); 
alert(myParam.key1); 

</script>

注:

1、substr()与substring(start,stop) ,提取字符串中介于两个指定下标之间的字符。

     重要事项:与 slice() 和 substr() 方法不同的是,substring() 不接受负的参数。参见http://www.w3school.com.cn/js/jsref_substring.asp

2、location.search.substring(1) ,location.search设置或返回从问号 (?) 开始的 URL(查询部分)。参见http://www.w3school.com.cn/htmldom/prop_loc_search.asp

3、exec() 方法用于检索字符串中的正则表达式的匹配。太强大了,还不会用,参考http://www.w3school.com.cn/js/jsref_exec_regexp.asp

4、使用 decodeURIComponent() 对编码后的 URI 进行解码。参见http://www.w3school.com.cn/js/jsref_decodeURIComponent.asp

原文地址:https://www.cnblogs.com/cssfirefly/p/2629796.html