js 获取url中的参数|极客笔记

js 获取url中的参数

在网页开发中，经常会遇到需要获取url中的参数的需求。比如，用户从某个页面跳转到另一个页面时，需要将一些信息作为参数传递给目标页面。这时就需要通过js来获取url中的参数。

方法一：使用正则表达式

一种常见的方法是使用正则表达式来获取url中的参数。下面是一个简单的示例代码：

function getUrlParams() {
    var params = {};
    var url = window.location.href;
    var reg = /[?&]+([^=&]+)=([^&]*)/g;
    url.replace(reg, function(match, key, value) {
        params[key] = value;
    });
    return params;
}

// 使用示例
var params = getUrlParams();
console.log(params);

在上面的代码中，首先定义了一个getUrlParams函数，然后通过正则表达式匹配url中的参数，并将参数存储在一个对象中返回。最后通过console.log打印获取到的参数。

运行上面的代码，输出可能如下：

{
    id: "123",
    name: "john"
}

方法二：使用URLSearchParams对象

另一种获取url参数的方法是使用URLSearchParams对象。这是一种相对简单和直观的方式。下面是示例代码：

function getUrlParams() {
    var params = {};
    var searchParams = new URLSearchParams(window.location.search);
    for (var pair of searchParams.entries()) {
        params[pair[0]] = pair[1];
    }
    return params;
}

// 使用示例
var params = getUrlParams();
console.log(params);

在这段代码中，new URLSearchParams(window.location.search)会返回一个包含url中所有参数的URLSearchParams对象，然后通过entries()方法遍历参数，并存储在一个对象中返回。最后打印获取到的参数。

运行上面的代码，输出可能如下：