关键词

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对象可以更快捷地获取地址栏参数信息,而使用正则表达式可以更灵活地解析地址栏上的字符串。根据实际需求,可以灵活选择使用其中的一种方法。

本文链接:http://task.lmcjl.com/news/925.html

展开阅读全文