使用JSON数据填充表单

要使用JSON数据填充表单，你需要遵循以下步骤：

准备JSON数据：首先，你需要一个包含表单数据的JSON对象。例如：

{
  "name": "John Doe",
  "email": "john.doe@example.com",
  "phone": "123-456-7890"
}

获取表单元素：在JavaScript中，你需要获取表单中的各个输入元素。你可以通过元素的ID或者其他方法（如querySelector）来获取它们。例如：

const nameInput = document.getElementById('name');
const emailInput = document.getElementById('email');
const phoneInput = document.getElementById('phone');

解析JSON数据：将JSON字符串解析为JavaScript对象。如果你已经有了JSON对象，可以跳过这一步。例如：

const jsonString = '{"name":"John Doe","email":"john.doe@example.com","phone":"123-456-7890"}';
const jsonData = JSON.parse(jsonString);

填充表单：遍历JSON对象的键值对，并将值设置到对应的表单元素中。例如：

for (const key in jsonData) {
  if (jsonData.hasOwnProperty(key)) {
    const input = document.getElementById(key);
    if (input) {
      input.value = jsonData[key];
    }
  }
}

将以上代码整合在一起，可以创建一个函数来填充表单：

function fillFormWithJson(jsonString) {
  const jsonData = JSON.parse(jsonString);

  for (const key in jsonData) {
    if (jsonData.hasOwnProperty(key)) {
      const input = document.getElementById(key);
      if (input) {
        input.value = jsonData[key];
      }
    }
  }
}

const jsonString = '{"name":"John Doe","email":"john.doe@example.com","phone":"123-456-7890"}';
fillFormWithJson(jsonString);

现在，当你调用fillFormWithJson函数并传入JSON字符串时，表单将被填充。请确保在HTML中为每个输入元素设置了正确的ID。