JS的Form表单转JSON格式的操作代码

JS的Form表单转JSON格式的操作代码可以通过以下步骤实现：

1. 获取表单元素

使用document.querySelector()方法获取到表单元素对象。例如：

const form = document.querySelector('#myForm');

1. 遍历表单元素

使用forEach()方法遍历表单元素的所有表单控件，并将其转换为JSON格式。例如：

const formData = {};
form.querySelectorAll('input, select, textarea').forEach((field) => {
  formData[field.name] = field.value;
});

这段代码中，我们先创建了一个空的对象formData，然后使用querySelectorAll()选择器方法获取到表单里面的所有表单控件。这里使用了ES6箭头函数的写法，对于每一个表单控件，我们将其name属性作为JSON对象的属性名，将其value属性作为JSON对象的属性值。

1. 将JSON格式化为字符串

使用JSON.stringify()方法将JSON对象转换为字符串。例如：

const jsonData = JSON.stringify(formData);

这段代码中，我们使用了JSON.stringify()方法将JSON对象formData转换为一个JSON格式的字符串jsonData。

综合代码示例：

const form = document.querySelector('#myForm');
const formData = {};
form.querySelectorAll('input, select, textarea').forEach((field) => {
  formData[field.name] = field.value;
});
const jsonData = JSON.stringify(formData);
console.log(jsonData);

下面给出一个完整的HTML代码示例：

<form id="myForm">
  <label for="name">Name</label>
  <input type="text" name="name" id="name">
  <br>
  <label for="email">Email</label>
  <input type="email" name="email" id="email">
  <br>
  <label for="msg">Message</label>
  <textarea name="msg" id="msg"></textarea>
  <br>
  <input type="submit" value="Submit">
</form>
<script>
  const form = document.querySelector('#myForm');
  const formData = {};
  form.querySelectorAll('input, select, textarea').forEach((field) => {
    formData[field.name] = field.value;
  });
  const jsonData = JSON.stringify(formData);
  console.log(jsonData);
</script>

在这个示例中，我们定义了一个包含三个表单控件的表单，然后通过JS代码将这个表单转换为JSON格式，并在控制台输出JSON格式的字符串。

另外一个示例：

<form id="myForm2">
  <input type="text" name="username" placeholder="Enter username"><br>
  <input type="password" name="password" placeholder="Enter password"><br>
  <input type="submit" value="Submit">
</form>
<script>
  const form = document.querySelector('#myForm2');
  const formData = {};
  form.querySelectorAll('input').forEach((field) => {
    formData[field.name] = field.value;
  });
  const jsonData = JSON.stringify(formData);
  console.log(jsonData);
</script>

这个示例中，我们定义了一个包含两个输入框控件的表单，然后通过JS代码将这个表单转换为JSON格式，并在控制台输出JSON格式的字符串。