Javascript 读取查询参数

在某些情况下，我们可能需要从当前网页的URL中获取查询参数。这些参数通常用来向服务器传递数据或在网页中进行操作。Javascript提供了一系列方法来读取URL中的查询参数。

Method 1：使用URLSearchParams对象

ES6中引入了一个新对象URLSearchParams，它提供了一个方便的方式来操作URL中的查询参数。

const urlParams = new URLSearchParams(window.location.search);
const myParam = urlParams.get('myParam');
console.log(myParam);

在这个方法中，我们首先创建一个URLSearchParams对象，传递window.location.search作为参数。这将返回一个包含查询参数的对象。然后我们使用get()方法从对象中获取查询参数的值。

Method 2：使用正则表达式

如果您不想使用URLSearchParams对象，您也可以使用正则表达式从URL中获取查询参数的值。

const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const regex = /(\?|&)(\w+)=([^&]*)/g;
let match = regex.exec(queryString);
while (match) {
  console.log(`Param name: ${match[2]}`);
  console.log(`Param value: ${match[3]}`);
  match = regex.exec(queryString);
}

在这个方法中，我们首先获取当前网页URL中的查询参数。我们使用正则表达式来匹配查询参数和它们的值。我们使用exec()方法来查找匹配的第一个结果。在while循环中，我们继续匹配直到找到所有的匹配。

Conclusion

以上是 Javascript 读取查询参数的两种方法，我们可以根据需要来选择使用哪种方法。无论使用哪种方法，我们都可以轻松地获取URL中的查询参数。