XMLHttpRequest,jQuery.ajax,jQuery.post,jQuery.get之间有什么区别

时间:2011-01-11 11:50:02

标签: jquery ajax xmlhttprequest

如何找出最适合某种情况的方法?任何人都可以提供一些例子来了解功能和性能方面的差异吗?

6 个答案:

答案 0 :(得分:131)

  • XMLHttpRequest 是jQuery包含的原始浏览器对象,可用于更加实用和简化的表单以及跨浏览器的一致功能。

  • jQuery.ajax 是jQuery中的一般Ajax请求者,可以执行任何类型和内容请求。

  • 另一方面,
  • jQuery.get jQuery.post 只能发出GET和POST请求。如果你不知道这些是什么,你应该检查HTTP protocol并稍微学习一下。在内部,这两个函数使用jQuery.ajax但它们使用您没有自己设置的特定设置,因此与使用jQuery.ajax相比,简化了GET或POST请求。无论如何,GET和POST是最常用的HTTP方法(与DELETE,PUT,HEAD甚至其他很少使用的exotics相比)。

所有jQuery函数在后台使用XMLHttpRequest对象,但提供您不必自己执行的其他功能。

用法

因此,如果您使用的是jQuery,我强烈建议您使用jQuery功能 。完全忘掉XMLHttpRequest。使用合适的jQuery请求函数变体,在所有其他情况下使用$.ajax()。所以不要忘记还有其他common jQuery Ajax related functions$.get()$.post()$.ajax()。那么你可以使用$.ajax()来处理所有请求,但是你需要编写更多的代码,因为它需要更多的选项来调用它。

类比

就像你可以为自己买一辆汽车发动机,你必须用它来制造整车,转向,刹车等...汽车制造商生产完整的汽车,具有友好的界面(踏板,方向盘等等)所以你不必自己动手。

答案 1 :(得分:25)

他们每个人都使用XMLHttpRequest。这是浏览器用于发出请求的内容。 jQuery只是一个JavaScript库,$.ajax方法用于创建XMLHttpRequest。

$.post$.get只是$.ajax的简写版本。它们几乎完全相同,但可以更快地编写AJAX请求 - $.post发出HTTP POST请求,$.get发出HTTP GET请求。

答案 2 :(得分:4)

jQuery.getjQuery.ajax的包装器,它是XMLHttpRequest的包装器。

XMLHttpRequest和Fetch API(此时为实验)是DOM中唯一的,因此应该是最快的。

我看到很多信息不再准确,所以我创建了一个测试页面,任何人都可以在任何时候测试版本最适合的版本:

https://jsperf.com/xhr-vs-jquery-ajax-vs-get-vs-fetch

从我今天的测试中可以看出,只有jQuery不是一个干净甚至是快速的解决方案,我在移动或桌面上的结果表明,如果你使用jQuery,jQuery至少比XHR2慢80%很多ajax,在移动设备上加载一个简单的网站需要花费很多时间。

用法本身也在链接中。

答案 3 :(得分:1)

jQuery.post和jQuery.get模拟典型的页面加载,也就是说,单击提交按钮,它会将您带到新页面(或重新加载同一页面)。发布数据并将其发送到服务器的方式略有不同(可以找到关于它的好文章here

jQuery.ajax和XMLHttpRequest是类似于post和get的页面加载,除了页面没有改变。无论服务器返回什么信息,本地javascript都可以使用它以任何方式使用,包括修改页面布局。它们通常用于进行异步工作,而用户仍然可以浏览页面。这方面的好例子是通过从数据库值动态加载来完成文本字段的自动完成功能。 jQuery.ajax和XMLHttpRequest之间的根本区别在于jQuery.ajax使用XMLHttpRequest来实现相同的效果,但界面更简单。如果你使用jQuery,我建议你坚持使用jQuery.ajax。

答案 4 :(得分:1)

旧帖子。但仍想回答,我与网络工作者(javascript)

一起工作时遇到的一个区别

网络工作者无法进行任何UI级访问。这意味着您无法访问任何DOM 您打算使用网络工作者运行的JavaScript代码中的元素。无法在网络工作者代码中访问诸如窗口,文档和父对象之类的对象。

我们知道 jQuery 库与HTML DOM绑定,并允许其违反“无DOM访问”规则。这可能会有些痛苦,因为 jQuery.ajax,jQuery.post,jQuery.get 之类的方法无法在网络工作者中使用。幸运的是,您可以使用 XMLHttpRequest 对象以发出Ajax请求。

答案 5 :(得分:0)

就jQuery方法而言,.post.get只是在内部执行.ajax,其目的是抽象出.ajax的一些不必要的选项并提供一些默认值分别适用于该类型的请求。

我怀疑3中任何一个之间的表现有很大差异。

.ajax方法本身就是一个XMLHttpRequest,它会根据jQuery的其余部分进行大量优化,但它可能不会像你自己定制整个交互一样高效..但那是编写大量代码或编写jQuery.ajax之间的区别。