Javascript 以 JSON 格式获取表单数据

在网页开发中，获取表单数据是非常常见的需求之一，而将表单数据转换成 JSON 格式则更加方便。下面我们来介绍一下如何通过 JavaScript 将表单数据转换成 JSON 格式。

获取表单数据

首先，我们需要获取表单元素的值。我们可以通过 HTML 的 name 属性来获取表单元素的值，可以使用 document.getElementsByName() 或 document.getElementById() 等方法来获取表单元素。

代码示例：

// 通过 name 属性获取表单元素的值
let name = document.getElementsByName('name')[0].value;
let age = document.getElementsByName('age')[0].value;
let gender = document.getElementsByName('gender')[0].value;

转换成 JSON 格式

获取到表单元素的值后，我们可以将它们转换成 JSON 格式。可以使用 JavaScript 的 JSON.stringify() 方法来转换成 JSON 格式。

代码示例：

// 将表单元素的值转换成 JSON 格式
let data = {
  name: name,
  age: age,
  gender: gender
};

let jsonData = JSON.stringify(data);

完整代码

// 通过 name 属性获取表单元素的值
let name = document.getElementsByName('name')[0].value;
let age = document.getElementsByName('age')[0].value;
let gender = document.getElementsByName('gender')[0].value;

// 将表单元素的值转换成 JSON 格式
let data = {
  name: name,
  age: age,
  gender: gender
};

let jsonData = JSON.stringify(data);
console.log(jsonData);

结语

通过 JavaScript 将表单数据转换成 JSON 格式是一个非常便捷的操作，可以方便地将表单数据传递到服务器端进行处理。希望本文对于您有所帮助。