Javasrcipt中从一个url或者从一个字符串中获取参数值得方法

Posted 2020-10-28 曼施坦因

从url中获取参数值是che程序开发过程中的常用需求，偶然得闲，便抽空研究了一下javasrcipt下，获取参数的办法（JAVA中也类似）。

首先看url的规范：

URL组成:
protocol :// hostname[:port] / path / [;parameters][?query]#fragment
协议://主机名[:端口]/ 路径/[:参数] [?查询]#Fragment

一个规范的url参数总是在【？query】部分，以 “变量名=值”这样的形式存在；

这样就给我们取值提供了一个思路：

 

第一种方法：利用正则表达式，从url中获取我们需要的对应的参数的值

 

 

 

 

　　

 

 

 1 function getUrlPramByName(name){
 2      var url = window.location.search;  //获取url中？之后的内容
 3      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); 
 4      if(url){
 5           var r = url.substr(1).match(reg); 
 6 
 7           if (r != null) {
 8                  return decodeURI(r[2]); 
 9           }else{
10                  return null; 
11           }
12      };  
13 };

 

可以自己在浏览器控制台执行下，这种方法只能单独使用，获取自己需要的那个参数值得变量

 

第二种方法： 利用字符串操作将所需要的值全部提出来

function getAllUrlPram(){
    var url = window.location.search;   //获取url中?后面的内容

    if(url  && url.indexOf("?")!= -1){
       url = url.substr(1);   //去掉前面的？

       var arr = url.split("&");  //将字符串以&为分隔符转化为数组

       var obj = {};  //定义一个空对象

       for(var i=0;i<arr.length;i++){
           var str0 = arr[i].split("=")[0],      //将获得数组中的每一个元素字符串转换成用"="分割的数组，数组第一个元素即为key
                 str1 = arr[i].split("=")[1];      //将获得数组中的每一个元素字符串转换成用"="分割的数组，数组第一个元素即为value
           obj[str0] = decodeURI(str1);     //由于url中使用的是转义后的字符，因此必须使用decodeURI进行解码
       }
           
       return obj;
    }else {
       return null;
    }
}

 

 

这样我们可以定义一个在String原型链上的通用方法了：

 

String.prototype.getUrlParms = function(){
      var index = this.indexOf("?");
       if(index !=-1){
            var str = this.substr(index+1);
            var arr = str.split("&");  //将字符串以&为分隔符转化为数组
            var obj = {};  //定义一个空对象
           for(var i=0;i<arr.length;i++){
               var str0 = arr[i].split("=")[0],      //将获得数组中的每一个元素字符串转换成用"="分割的数组，数组第一个元素即为key
                     str1 = arr[i].split("=")[1];      //将获得数组中的每一个元素字符串转换成用"="分割的数组，数组第一个元素即为value
               obj[str0] = decodeURI(str1);     //由于url中使用的是转义后的字符，因此必须使用decodeURI进行解码
           }       
           return obj;
        }else{
           return;
        }
}

 

 

最终对字符串执行getUrlParms（）方法后，就会得到一个包含所有需要的参数和参数对应的值得对象了；