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


Answers:


145
  • XMLHttpRequest 是jQuery包装为更有用和更简化的形式以及跨浏览器一致功能的原始浏览器对象。

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

  • jQuery.getjQuery.post另一方面只能发出GET和POST请求。如果您不知道这些是什么,则应检查HTTP协议并学一点点。这两个函数在内部使用,jQuery.ajax但它们使用的是您不必自行设置的特定设置,因此与使用相比,简化了GET或POST请求jQuery.ajax。无论如何,GET和POST都是最常用的HTTP方法(相比于DELETE,PUT,HEAD甚至其他很少使用的外来符号)。

所有jQuery函数都XMLHttpRequest在后台使用object,但是提供了您不必自己做的其他功能。

用法

因此,如果您使用的是jQuery,我强烈建议您使用jQuery功能。XMLHttpRequest完全忘了。使用合适的jQuery请求函数变体,并在所有其他情况下使用$.ajax()。所以,不要忘记还有其他常见的jQuery的Ajax相关的功能$.get()$.post()$.ajax()。好吧,您可以只使用$.ajax()所有请求,但是您将不得不编写更多代码,因为调用它需要更多选项。

比喻

就像您可以购买汽车发动机一样,您必须在汽车周围使用转向,制动器等来制造整车。汽车制造商生产的整车具有友好的界面(踏板,方向盘等)。因此您不必自己做所有事情。


在性能上使用$ .ajax()有什么优势吗?
罗德里格斯

1
@罗德里格斯:不是真的。如果您想到的是$.post$.get唯一慢的是$.ajax调用之前的少量代码。但是,如果您直接使用XHR编写自己的例程,则可能会进行一些优化,但可能会出现更多问题。我建议您将自己放在jQuery方面。这将使您的生活更轻松。考虑到异步调用比发出代码要花费更长的时间,您可能会注意到这些调用之间没有明显的区别。
罗伯特·科里特尼克

感谢Robert Koritnik。所以我会得到$ .post和$ .get。
罗德里格斯

如果需要,您还可以继续$.ajax使所有地方的呼叫保持一致。只要您不直接使用XHR,无论哪种方式都很好。
罗伯特·科里特尼克

1
@RobertKoritnik IE中的缓存问题怎么样?使用XMLHttpRequest和$ .ajax()是否相同?
Bhargavi Gunda 2013年

28

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

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


上载和下载每个功能的数据传输限制如何
Rodrigues

GET请求将发送在URL字符串的所有数据-其可以通过客户机/服务器(限于stackoverflow.com/questions/2659952/...)。一个POST请求发送的所有数据的报头,所以URL大小限制不应该是一个问题(除非你真的长的文件和文件夹名称到脚本!)。
乔纳森·博斯特

好。简而言之,您的意思是,发送更多的数据使用post,接收更多的数据使用get,对吗?
罗德里格斯

@Rodrigues-是的,差不多:)通常,如果您只是想阅读某些内容(例如,请求从twitter获取推文列表),请使用GET。如果你正在寻找送东西(如张贴鸣叫),然后使用POST
乔纳森·枕

7

jQuery.get是的包装jQuery.ajax,这是XMLHttpRequest的包装。

XMLHttpRequest和Fetch API(目前处于实验阶段)是DOM中唯一的,因此应该是最快的。

我看到了很多不准确的信息,因此我创建了一个测试页,任何人都可以随时从最佳版本中测试版本:

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

从我今天的测试中可以看出,只有jQuery并不是一种干净甚至快速的解决方案,对于我来说,在移动设备或台式机上的结果表明,如果您使用过多的Ajax,则jQuery至少比XHR2慢80%,在移动设备中,加载简单的网站将花费大量时间。

用法本身也在链接中。


2

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

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


与创建XMLHttpRequest对象xmlhttp.open,send()和responseText相比,使用jquery有何优势?
罗德里格斯

根据您当前的浏览器,XMLHttpRequest对象的实例化方式有所不同。它将需要您花一点时间进行JavaScript维护,以提供使用XMLHttpRequest的基本接口。如果您已经有了jQuery,它将为您完成所有工作。这实际上是一个便利性问题,而不是功能性问题,因为从技术上讲,您可以使用任何一个做同样的事情。更不用说,由于jQuery包装了XMLHttpRequest对象,这意味着它可以将其提供给您,以防您想对它做一些特殊的事情。
尼尔

好的..谢谢Neil的建议...是否有像Visual Studio这样的IDE可用于通过php或aspx使用和调试jquery。
罗德里格斯

很难找到一个可以调试javascript和php或aspx的IDE,仅因为其中一个是服务器端而另一个是客户端。不幸的是,这意味着您必须单独调试javascript。但是,我发现firebug(getfirebug.com)通常对于调试javascript非常有用。在回调函数中放置一个断点,它会向您显示服务器提供的所有内容,并逐步显示javascript所做的一切。希望有帮助。
尼尔

1

旧帖子。但仍然想回答,我在与Web Workers(javascript)一起工作时遇到的一个区别

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

众所周知,jQuery库与HTML DOM绑定在一起,并允许它违反“无DOM访问”规则。这可能会有些痛苦,因为jQuery.ajax,jQuery.post,jQuery.get之类的方法无法在Web Worker中使用。幸运的是,您可以使用 XMLHttpRequest对象发出Ajax请求。


0

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

我怀疑这3个之间的性能是否有很大差异。

.ajax方法本身执行XMLHttpRequest,它将根据jQuery的其余部分进行大量优化,但它的效率可能不如您自己定制整个交互..但这就是编写大量代码或写作jQuery.ajax


是没有任何优势的定制jQuery.ajax
罗德里格斯

我假设您的意思是在速记方法上使用它,根据我的经验,如果大多数默认值是您想要的,并且需要非常具体地了解如何获取所需数据,则速记方法很有用。 Ajax通常是要走的路。
史蒂夫

谢谢史蒂夫。将使用post and get。如果您提供.ajax的示例,我可以做一些比较。
罗德里格斯
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.