关键词

js获取Get值的方法

下面是关于“JS获取Get值的方法”的完整攻略:

什么是Get请求

在Web开发中,我们常常需要通过URL传输数据。传输的方式有两种,一种是GET请求,另一种是POST请求。其中,GET请求通常用于获取数据,POST请求则通常用于提交数据。在GET请求中,数据是通过URL传递的,因此可以通过解析URL中的参数来获取数据。

JS获取Get值的方法

在JavaScript中,可以通过location.search属性来获取URL中的查询字符串,查询字符串一般包含了通过GET请求传递的数据。查询字符串以?开头,后面跟着一系列的key=value键值对,多个键值对之间用&符号连接。

例如,在以下URL中:

http://www.example.com?name=张三&age=20

查询字符串为?name=张三&age=20,其中nameage为两个键,对应的值分别为张三20

JavaScript可以通过以下代码来获取查询字符串:

let search = location.search;
console.log(search); // 输出:?name=张三&age=20

为了方便获取单个键值对的值,我们可以将查询字符串转换为JavaScript对象,通过对象的键名来获取对应的值。可以使用以下代码来实现:

function getQueryStringArgs() {
  // 去掉查询字符串开头的?
  let qs = (location.search.length > 0 ? location.search.substring(1) : ""),
  args = {},
  items = qs.length ? qs.split("&") : [];
  items.forEach(function(item, i) {
    let itemArr = item.split("="),
          name = decodeURIComponent(itemArr[0]),
          value = decodeURIComponent(itemArr[1]);
    if (name.length) {
      args[name] = value;
    }
  });
  return args;
}

上面的函数将查询字符串转换为一个对象,并返回这个对象。使用时,可以通过对象的键来获取对应的值。例如,在以下URL中:

http://www.example.com?name=张三&age=20

可以使用以下代码来获取nameage的值:

let args = getQueryStringArgs();
console.log(args.name); // 输出:张三
console.log(args.age); // 输出:20

示例说明

以下是两个获取GET请求参数值的示例:

示例一

以下是一个具体的例子,假设URL为:

http://www.example.com/index.html?key1=value1&key2=value2

我们可以使用以下代码来获取参数值:

let args = {};
let query = location.search.substring(1); // 去掉?号

// 将参数分割成数组
let pairs = query.split('&');

// 提取每个键值对中的key和value,并将它们作为属性和属性值添加到args对象中
for (let i = 0; i < pairs.length; i++) {
  let pos = pairs[i].indexOf('=');
  if (pos === -1) continue;
  let name = pairs[i].substring(0, pos);
  let value = pairs[i].substring(pos + 1);
  args[name] = value;
}

console.log(args.key1); // 输出:value1
console.log(args.key2); // 输出:value2

示例二

假设我们的URL为:

http://www.example.com/index.html?name=John&age=25

我们可以使用以下代码来获取参数值:

let params = new URLSearchParams(window.location.search);

let name = params.get('name');
let age = params.get('age');

console.log(name); // 输出:John
console.log(age); // 输出:25

以上就是获取GET请求参数值的两个示例,希望对你有所帮助。

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

展开阅读全文