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

问题描述 投票:110回答:6

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

jquery ajax xmlhttprequest
6个回答
133
投票
  • XMLHttpRequest是jQuery包装成更加可用和简化的形式以及跨浏览器一致功能的原始浏览器对象。
  • jQuery.ajax是jQuery中的一般Ajax请求者,可以执行任何类型和内容请求。
  • 另一方面,jQuery.getjQuery.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()来满足你的所有要求,但是你需要编写更多的代码,因为它需要更多的选项来调用它。

比喻

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


26
投票

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

$.post$.get只是$.ajax的简写版本。它们做了几乎相同的事情但是更快地编写了一个AJAX请求 - $.post发出HTTP POST请求而$.get发出HTTP GET请求。


5
投票

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

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

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

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

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

用法本身也在链接中。


1
投票

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

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


1
投票

老帖子。但仍想回答,我在使用Web Workers时面临的一个不同之处(javascript)

Web worker无法进行任何UI级别的访问。这意味着您无法访问要使用Web worker运行的JavaScript代码中的任何DOM元素。无法在Web工作器代码中访问窗口,文档和父级等对象。

我们知道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

© www.soinside.com 2019 - 2024. All rights reserved.