JavaScript/jQuery如何获取当前页面URL请求地址中的查询参数？

3 个回答

• 0

  一种简单的方式是使用URLSearchParams进行查询，示例如下：

  const urlParams = new URLSearchParams(window.location.search);
  const myParam = urlParams.get('myParam');
  

  或者，使用JavaScript创建一个函数，如下：

  function getParameterByName(name, url) {
      if (!url) url = window.location.href;
      name = name.replace(/[\[\]]/g, '\\$&');
      var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
          results = regex.exec(url);
      if (!results) return null;
      if (!results[2]) return '';
      return decodeURIComponent(results[2].replace(/\+/g, ' '));
  }
  

  调用示例如下：

  // 假如URL参数为: ?foo=lorem&bar=&baz
  var foo = getParameterByName('foo'); // "lorem"
  var bar = getParameterByName('bar'); // ""
  var baz = getParameterByName('baz'); // ""
  var qux = getParameterByName('qux'); // null
  

  评论 分享

  

  Rector

  2020-05-11 回答
• 0

  使用ES6实现的一种方式，如下：

  var qs = (function(a) {
      if (a == "") return {};
      var b = {};
      for (var i = 0; i < a.length; ++i)
      {
          var p=a[i].split('=', 2);
          if (p.length == 1)
              b[p[0]] = "";
          else
              b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
      }
      return b;
  })(window.location.search.substr(1).split('&'));
  

  调用示例如下：

  // ?topic=123&name=query+string
  qs["topic"];    // 123
  qs["name"];     // query string
  qs["nothere"];  // undefined (object)
  

  评论 分享

  

  Rector

  2020-05-11 回答
• 0

  使用jQuery的实现方式，如下：

  (function($) {
      $.QueryString = (function(paramsArray) {
          let params = {};
  
          for (let i = 0; i < paramsArray.length; ++i)
          {
              let param = paramsArray[i]
                  .split('=', 2);
  
              if (param.length !== 2)
                  continue;
  
              params[param[0]] = decodeURIComponent(param[1].replace(/\+/g, " "));
          }
  
          return params;
      })(window.location.search.substr(1).split('&'))
  })(jQuery);
  

  调用示例如下：

  // 获取一个参数名为param的参数值
  $.QueryString.param
  //-或者使用中括号的方式-
  $.QueryString["param"]
  
  //获取所有参数，返回的是一个以参数名为属性名的对象
  $.QueryString
  //返回结果类似 { param: "val", param2: "val" }
  

  评论 分享

  

  Rector

  2020-05-11 回答