Coding With Fun
Home Docker Django Node.js Articles Python pip guide FAQ Policy

A JavaScript function parses URL parameters into a Johnson object


May 08, 2021 JSON


Table of contents


Use the JS function to resolve the URL parameters to the JSON object

Problem: Write a JavaScript function parseQueryString, which is designed to parse URL parameters into an object.
For example: var obj-parseQueryString (url);

Create an object

There are three forms of creating objects:

One:

var Person=new Object();
Person.name="Sun";
Person.age=24;


Two:

var Person=new Object();
Person["name"]="Sun";
Person["age"]=24;


Three:

Object literal expression

var Person={
name: "Sun",
age: 24
}


Ps:
1, in this example, it is more suitable to use the second form, add elements to obj
2, split ("and"), if the url has only one parameter, there is no "and" when there is no error, will only return array .

function parseQueryString(url) {
    var obj = {};
    var keyvalue = [];
    var key = "",
        value = "";
    var paraString = url.substring(url.indexOf("?") + 1, url.length).split("&");
    for (var i in paraString) {
        keyvalue = paraString[i].split("=");
        key = keyvalue[0];
        value = keyvalue[1];
        obj[key] = value;
    }
    return obj;
}

The following describes JS according to the key value to obtain the parameter value in the URL and the URL parameters into a johnson object, js through two ways to obtain url pass parameters, code

Example one:

Converts the parameter portion of the url into a json object

 parseQueryString: function(url) {
     var reg_url = /^[^/?]+/ ? ([\w\W] + ) $ / ,
         reg_para = /([^&=]+)=([\w\W]*?)(&|$|#)/g,
         arr_url = reg_url.exec(url),
         ret = {};
     if (arr_url && arr_url[1]) {
         var str_para = arr_url[1],
             result;
         while ((result = reg_para.exec(str_para)) != null) {
             ret[result[1]] = result[2];
         }
     }
     return ret;
 }

Get the parameter value in the url with key

 getQueryString: function(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return unescape(r[2]);
    return null;
}

Example two:

js gets url pass parameters in two ways:

js gets url pass parameter method one:

Here is a JAVASCRIPT client solution that gets the URL with QUESTRING parameters, equivalent to asp's request.querystring, PHP's $_GET
Function:

function GetRequest() {
    var url = location.search; //获取url中"?"符后的字串 
    var theRequest = new Object();
    if (url.indexOf("?") != -1) {
        var str = url.substr(1);
        strs = str.split("&");
        for (var i = 0; i < strs.length; i++) {
            theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1]);
        }
    }
    return theRequest;
}

Then we get the corresponding parameter value by calling this function:

var Request = new Object();
Request = GetRequest();
var 参数1,参数2,参数3,参数N;
参数1 = Request[''参数1''];
参数2 = Request[''参数2''];
参数3 = Request[''参数3''];
参数N = Request[''参数N''];

This obtains the parameter with the same name as the url string

js gets url pass parameter method two positive analysis method:

function GetQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return (r[2]);
    return null;
}
alert(GetQueryString("参数名1"));
alert(GetQueryString("参数名2"));
alert(GetQueryString("参数名3"));

Other parameters get an introduction:

Set or get the file name or path specified by the object.

alert(window.location.pathname);

Set or get the entire URL as a string.

alert(window.location.href);

Set or get the port number associated with the URL.

alert(window.location.port);

The part of the protocol that sets or gets the URL.

alert(window.location.protocol);

Set or get segments in the href property that follow the hashtag .

alert(window.location.hash);

Set or get the hostname and port numbers for the location or URL.

alert(window.location.host);

Set or get the section of the href property that follows the question mark.

alert(window.location.search);