A:

Syntactic sugar

// If not, get route parameters. Returns an object. If the argument is given repeatedly, it is returned as an array, just like vue-router
getAllUrlParams([url])
Copy the code

use

// Scenario 1: Get the parameters of a URL
let href = 'https://www.baidu.com/s?wd= hahaha &rsv_spt=1'
getAllUrlParams(href )
* {wd: "hahaha ", rsv_spt: "1"} */

// Scenario 2: Get browser address bar parameters
getAllUrlParams() // The default query is location.href
Copy the code

code

// Get url parameters
function getAllUrlParams(urls) {
    var url = urls || location.href
    // Get the URL with JS. If the function receives the URL, use the function's arguments. If no parameter is passed, the CURRENT page URL is used
    var queryString = url ? url.split('? ') [1] : window.location.search.slice(1);
    // To store all of our parameters
    var obj = {};
    If no parameter is passed, an empty object is returned
    if(! queryString) {return obj;
    }
    // stuff after # is not part of query string, so get rid of it
    queryString = queryString.split(The '#') [0];
    // Divide the parameters into arrays
    var arr = queryString.split('&');
    for (var i = 0; i < arr.length; i++) {
        // Split into key:value
        var a = arr[i].split('=');
        // mark undefined as true
        var paramName = a[0];
        var paramValue = typeof (a[1= = =])'undefined' ? true : a[1];
        if (paramName.match(/\[(\d+)?\]$/)) {
            // If paramName does not exist, create a key
            var key = paramName.replace(/\[(\d+)?\]/.' ');
            if(! obj[key]) obj[key] = [];E.g. colors[2]
            if (paramName.match(/\[\d+\]$/)) {
                // Get the index value and add the value at the corresponding position
                var index = /\[(\d+)\]/.exec(paramName)[1];
                obj[key][index] = paramValue;
            } else {
                // If it is any other type, put it in the arrayobj[key].push(paramValue); }}else {
            // Handle string types
            if(! obj[paramName]) {// If paramName does not exist, create a property of the object
                obj[paramName] = paramValue;
            } else if (obj[paramName] && typeof obj[paramName] === 'string') {
                // If the attribute exists and is a string, then it is converted to an array
                obj[paramName] = [obj[paramName]];
                obj[paramName].push(paramValue);
            } else {
                // If it is any other type, throw it into the arrayobj[paramName].push(paramValue); }}}return obj;
}
Copy the code

Method 2

use

let href = 'https://www.baidu.com/s?wd= hahaha &rsv_spt=1'
getQuerys(href);
* {wd: "hahaha ", rsv_spt: "1"} */

// Get the browser page parameter getQuerys(location.href)
Copy the code
 function getQuerys(e) {
    if(! e)return "";
    var t = {},
    r = [],
    n = "",
    a = "";
    try {
        var i = [];
        if (e.indexOf("?") > =0 && (i = e.substring(e.indexOf("?") + 1, e.length).split("&")), i.length > 0) for (var o in i) n = (r = i[o].split("="))0],
        a = r[1],
        t[n] = a
    } catch(s) {
        t = {}
    }
    return t
}
Copy the code

Method 3:

This method can only be used to obtain a single parameter in the browser parameters, and is not recommended because of poor flexibility

export const getQueryString = (name) = > {
    const reg = new RegExp('(^ | &)' + name + '= (/ ^ & *) (& | $)'.'i');
    const search = window.location.search.split('? ') [1] | |' ';
    const r = search.match(reg) || [];
    return r[2];
}
Copy the code

Here’s how:

// For example: https://www.baidu.com/s?wd= hahaha&rsv_spt =1
getQueryString('wd') // Print: "hahaha"
Copy the code

Blog address