页面本身的的函数怎么直接使用表单form提交后的数据

在HTML中，通常我们通过JavaScript来操作表单并获取用户提交的数据。当你想要直接在页面上使用表单`<form>`提交后的数据时，可以遵循以下步骤：

1. **事件监听**：首先，你需要给表单添加一个事件处理器，比如 `onsubmit`，它会在表单被提交时触发。例如：

   <form id="myForm" onsubmit="event.preventDefault(); handleFormSubmit(event)">
     <!-- form elements -->
   </form>

这里，`event.preventDefault()` 阻止了默认的表单提交行为，防止页面刷新。

2. **处理函数**：创建一个 JavaScript 函数 `handleFormSubmit(event)`，在这个函数中，你可以通过 `event.target` 获取到表单元素及其提交的数据：

   function handleFormSubmit(event) {
     event.preventDefault();
     const formData = new FormData(event.target); // 使用FormData对象保存数据
     // formData现在包含了表单字段及值
     console.log(formData);
     // 进行后续处理，如发送 AJAX 请求、更新DOM等
   }

3. **访问数据**：`formData` 对象提供了一系列方法（如 `get`, `getAll`, 等）来获取数据，例如获取某个输入框的值：

   const inputNameValue = formData.get('inputName');

4. **执行操作**：拿到数据后，你可以根据需求做相应的事情，比如将数据发送到服务器、显示在页面上等等。