JS获取地址栏参数的两种方法(简单实用)

JS获取地址栏参数是前端开发中经常用到的功能，一般用于获取URL中的参数信息来完成一些操作。下面我将详细讲解 JS获取地址栏参数的两种方法。

方法一：使用URLSearchParams对象

URLSearchParams对象是ES6中新增的一个API，用于获取URL中的参数信息。使用该对象获取地址栏参数的代码示例如下：

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

以上代码中，URLSearchParams对象的构造函数接收一个参数，即地址栏上的search字符串，通过get方法获取对应的参数值。

方法二：使用正则表达式

正则表达式也可以用于获取地址栏参数信息。该方法主要是通过正则表达式的方式解析地址栏上的search字符串，获取对应的参数值。代码示例如下：

const reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
const r = window.location.search.substr(1).match(reg);
const value = r ? decodeURIComponent(r[2]) : null;

以上代码中，首先构造一个正则表达式，用于匹配到待获取的参数，然后使用match方法匹配地址栏上的search字符串，最后获取到对应的参数值。

通过以上两种方法的讲解，我们可以看出：使用URLSearchParams对象可以更快捷地获取地址栏参数信息，而使用正则表达式可以更灵活地解析地址栏上的字符串。根据实际需求，可以灵活选择使用其中的一种方法。