HTML表单与XMLHTTPRequest？

Question

使用HTML Form元素和XMLHTTPRequest进行发布之间有什么区别？

为什么表单可以允许重定向到另一个网页，但是显然XMLHTTPRequest不能？

如果我发出POST请求，则应该能够制定具有相同属性的请求，并期望具有相同的行为。

Answer 1

使用HTML Form元素和XMLHTTPRequest进行发布之间有什么区别？

XMLHttpRequest允许执行异步操作，这些操作不会阻塞客户端的UI。使用HTML表单时，在执行操作时客户端将被阻止。

同样（如您所指出的），HTML表单提交会导致页面重新加载到指定的URL，而XHR不会-仅会导致返回数据。返回的数据可能只是页面内容的一部分，因此XHR不会引起整个页面的重新加载。它允许我们动态更新页面的一部分。

为什么表单可以允许重定向到另一个网页，但是显然XMLHTTPRequest不能？

XHR可以为其配置“成功”回调函数。成功完成操作后，回调函数可以执行您想做的任何事情，包括重定向。

如果我发出POST请求，则应该能够制定具有相同属性的请求，并期望具有相同的行为。

您是说HTML请求应该能够与XHR请求一样配置吗？如果是这样，那么不是的。可以将XHR请求配置为非常精细的级别（用户名和密码，数据类型，缓存，成功回调，失败回调等）。这（和XHR的异步特性）是XHR受欢迎的原因。

Answer 2

我认为你应该回顾一下简要的历史和演变。

回到过去，当 HTML HTTP 很简单时，人们用来发布表单，但它有一些问题？

1. 每次提交请求时
2. 转到服务器获取处理后的响应
3. 来到客户端（整个页面重新渲染/重定向到新页面）

好的，但是如果用户没有输入正确的表单值怎么办？？？当时网络使用速度很慢，所以英雄 JavaScript 出现了

1. 现在使用提交表单
2. 在客户端/浏览器上它得到验证
3. 用户立即收到错误消息并且（服务器不需要因错误请求而烧毁处理器。可以服务更多请求）
4. 但是，当信息提交页面刷新或重定向时，仍然意味着渲染和加载它的时间

现在聪明人用XMLHTTPRequest/AJAX来了为什么要刷新页面呢？

1. 如果页面保持不变并且仅需要的信息可以传输到服务器怎么办？
2. 现在当前页面下只有服务器响应才能读取成功或失败。
3. 仅更新部分页面以指示操作是否在服务器上完成。从而带来更好的用户体验。

随着更好的浏览器和服务器的出现，这在 SPA（单页应用程序）等方面得到了发展。

导入一个是用一些代码，

甚至 XHR 可以重定向到其他页面或重新加载页面 ex window.location = '' 并且还可以阻止 FORM 重定向 ex e.preventDefault()

检查AJAX相关信息，它将帮助您理解为什么部分以及为什么它如此有趣。

希望有帮助

Answer 3

XmlHttpRequest 不会重新加载页面，而 HTML Form 会重新加载。这是主要的区别