本文介绍了如何在不刷新整个页面的情况下，将位于特定
容器内的表单提交到该容器内。主要探讨了使用
search_result.html:
// 初始搜索结果
当在search_result.html 中提交表单时，结果将仅在
注意事项：
- 需要维护额外的 HTML 文件。
- 父页面和
方案二：使用 Ajax
另一种方案是使用 JavaScript 拦截表单提交，然后使用 Ajax 技术将表单数据发送到服务器，并将服务器返回的结果更新到目标
中。
示例代码：
// 搜索条件// 初始搜索结果
代码解释：
- event.preventDefault(): 阻止表单的默认提交行为，防止页面刷新。
- new FormData(form): 创建一个 FormData 对象，包含表单中的所有数据。
- fetch('/search', ...): 使用 Fetch API 发送 Ajax 请求到服务器的 /search 路径。
- response.text(): 将服务器返回的响应转换为文本（HTML）。
- document.querySelector('#searchResult').innerHTML = html: 将服务器返回的 HTML 替换目标 的内容。
注意事项：
- 需要服务器端代码来处理 Ajax 请求，并返回相应的 HTML 内容。
- 需要考虑错误处理和加载状态的显示。
- 可以使用更高级的 JavaScript 框架（如 React、Vue 或 Angular）来简化 Ajax 请求和 DOM 操作。
更常见的做法：保留搜索条件进行分页
虽然上述两种方案可以实现将表单提交到特定
的目的，但更常见的做法是在分页链接中包含所有必要的搜索条件，以便在点击分页链接时重新创建搜索结果。例如，可以将搜索条件作为 URL 参数添加到分页链接中：
下一页
当用户点击 "下一页" 链接时，整个页面将被重新加载，并且服务器可以使用 URL 参数中的搜索条件来重新生成搜索结果。 这种方法更简单，更易于维护，并且更符合 Web 的标准行为。
总结：
本文介绍了两种将表单提交到特定
的方法：使用
