如何使用 jQuery 將所有 URL 參數放入對象數組中？

Question

我有一個像這樣的字符串/url https://example.com/loadcontent?var1=100&var2=:somevar&var3=:morevariables

我需要循環思考 url 中的每個參數。 如果值以:開頭，則表明它是一個變量，我將需要通過查看與該變量匹配的相應元屬性來動態更改該值。

這是我的代碼，其中循環遍歷數組並設置參數的值。

    var baseURL = getBaseURL(url);

    var params = getParams(url);
    var newParams = $.each(params, function(index, param){

       if( param.value.substring(0, 1) == ':'){
           var myVar = param.value.substring(1);
           param.value = $('meta[name=" + myVar + "']).attr('value');
       }

    });

    var finalURL = baseURL + '?' + jQuery.param( newParams );

function getParams(url){
  // This function should return an array of objects. Each object should have 2 properties "value" and "name". The "name" property should be the name of the parameter (ie. var1, var2, var3 .....) and the "value" attribute should contains the value of the parameter (ie. 100, :somevar, :morevariables)


}

function getBaseURL(url){

  var cutoff = url.indexOf('?');

  if( cutoff > -1){
     return url.substring(0, cutoff - 1);
  }

  return url;

}

我需要幫助將給定 URL 的參數轉換為對象數組。 我怎樣才能在 jQuery 中做到這一點？

Answer 1

您無需為此使用jQuery。

function getParams(url) {

        var queryString = url.substring(url.indexOf('?') + 1);
        var paramsArr = queryString.split('&');
        var params = [];

        for (var i = 0, len = paramsArr.length; i < len; i++) {
            var keyValuePair = paramsArr[i].split('=');
            params.push({
                name: keyValuePair[0],
                value: keyValuePair[1]
            });
        }

        return params;
}

Answer 2

這是使用地圖的示例

 var url = 'https://example.com/loadcontent?var1=100&var2=:somevar&var3=:morevariables&test'; function getParamArray(url) { var queryString = url.substring(url.lastIndexOf("?") + 1); return queryString.split('&').map(function(sParam) { var param = sParam.split('='); return { name: param[0], value: decodeURIComponent(param[1]) }; }); } document.getElementById("output").innerHTML = JSON.stringify(getParamArray(url), null, 2); 

 <pre id="output"></pre> 

Answer 3

使用常規表達式和JSON.parse：

 var url = 'https://example.com/loadcontent?var1=100&var2=:somevar&var3=:morevariables';

url = url.replace(/^.*\?/,'');
url = url.replace(/(\w+)=?([\w:]*)/g,'{"name":"$1","value":"$2"}');
url = url.replace(/&/g,',');

var paramsObject = JSON.parse("["+url+"]");


/*
Returns: 

Array [{"name":"var1","value":"100"},{"name":"var2","value":":somevar"},{"name":"var3","value":":morevariables"}];
*/

Answer 4

您甚至不需要JQuery。

<script type="text/javascript">
var paramStr = window.location.search;
var params = paramStr.substring(1, paramStr.length).split('&');
var paramList = [];
for (var index=0; index < params.length; index++) {
    var param = params[index].split('=');
    paramList.push({name: param[0], value: param[1]});
}
</script>

結果：

[Object]0: Object
name: "a"
value: "b"
...

Answer 5

 var url=new URLSearchParams(window.location.search);
        var params = [];
        for(var value of url.keys())
        {
            params.push({
                name: value,
                value: url.get(value)
            });
        }