В чем разница между XMLHttpRequest, jQuery.ajax, jQuery.post, jQuery.get

Question

Как узнать, какой метод лучше всего подходит для ситуации?Кто-нибудь может привести несколько примеров, чтобы узнать разницу в функциональности и производительности?

Answer 1

• XMLHttpRequest - это необработанный объект браузера, который jQuery превращает в более удобную и упрощенную форму и обеспечивает совместимость между браузерами.

• jQuery.ajax - общий запросчик Ajax в jQuery, который может выполнять любые запросы типов и содержимого.

• jQuery.get и jQuery.post, с другой стороны, может выдавать только запросы GET и POST.Если вы не знаете, что это такое, вам следует проверить протокол HTTP и немного узнать.Внутренне эти две функции используют jQuery.ajax, но они используют особые настройки, которые вам не нужно устанавливать самостоятельно, что упрощает запрос GET или POST по сравнению с использованием jQuery.ajax.GET и POST в любом случае являются наиболее часто используемыми методами HTTP (по сравнению с DELETE, PUT, HEAD или даже другими редко используемыми экзотиками).

Все функции jQuery используют XMLHttpRequest объект в фоновом режиме,но предоставьте дополнительную функциональность, которую вам не нужно делать самостоятельно.

Использование

Поэтому, если вы используете jQuery, я настоятельно рекомендую использовать функциональность jQuery только .Забудьте о XMLHttpRequest в целом.Используйте подходящие варианты функции запроса jQuery, а во всех остальных случаях используйте $.ajax().Так что не забывайте, что есть другие общие функции, связанные с jQuery Ajax до $.get(), $.post() и $.ajax().Ну, вы можете просто использовать $.ajax() для всех ваших запросов, но вам придется написать немного больше кода, потому что для его вызова нужно немного больше вариантов.

Аналогия

Этокак если бы вы могли купить себе автомобильный двигатель, чтобы создать вокруг него целую машину с рулевым управлением, тормозами и т. д. Производители автомобилей выпускают готовые автомобили с дружественным интерфейсом (педали, руль и т. д.), поэтомувам не нужно делать все это самостоятельно.

Answer 2

Каждый из них использует XMLHttpRequest.Это то, что браузер использует для выполнения запроса.jQuery - это просто библиотека JavaScript, а для создания XMLHttpRequest используется метод $. ajax .

$. post и $. get это просто сокращенные версии $.ajax.Они делают почти то же самое, но ускоряют написание AJAX-запроса - $.post делает HTTP-запрос POST, а $.get делает HTTP-запрос GET.

Answer 3

jQuery.get - это оболочка для jQuery.ajax, которая является оболочкой для XMLHttpRequest.

XMLHttpRequest и Fetch API (экспериментальные в настоящее время) являются единственными в DOM, поэтому должны быть самыми быстрыми.

Я видел много информации, которая больше не является точной, поэтому я сделал тестовую страницу, где каждый может протестировать версию из версии, которая является лучшей в любое время:

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

Из моих сегодняшних тестов видно, что только jQuery не является чистым или даже быстрым решением, результаты для меня на мобильных устройствах или компьютерах показывают, что jQuery по крайней мере на 80% медленнее, чем XHR2, если вы используете слишком много ajax, в мобильном устройстве загрузка простого сайта займет много времени.

Само использование тоже есть в ссылке.

Answer 4

Старый пост. но все же хочу ответить, с одним отличием, с которым я столкнулся при работе с Web Workers (javascript)

веб-работники не могут иметь никакого доступа на уровне пользовательского интерфейса. Это означает, что вы не можете получить доступ к любой DOM элементы в коде JavaScript, которые вы собираетесь запускать с помощью веб-работников. К таким объектам, как окно, документ и родительский элемент, нельзя получить доступ из кода веб-работника.

Как мы знаем, библиотека jQuery привязана к HTML DOM, и ее разрешение нарушает правило «нет доступа к DOM». Это может быть немного болезненно, потому что такие методы, как jQuery.ajax, jQuery.post, jQuery.get , не могут использоваться в веб-работниках. К счастью, вы можете использовать XMLHttpRequest объект для выполнения Ajax-запросов.

Answer 5

jQuery.post и jQuery.get имитируют типичные загрузки страниц, то есть вы нажимаете кнопку отправки и вы переходите на новую страницу (или перезагружаете ту же страницу).отправка и получение немного отличаются в том, как данные отправляются на сервер (хорошую статью об этом можно найти здесь .

jQuery.ajax и XMLHttpRequest - загрузки страниц, аналогичные публикациии получить, за исключением того, что страница не изменяется. Любая информация, которую возвращает сервер, может использоваться javascript локально для любого использования, включая изменение макета страницы. Обычно они используются для выполнения асинхронной работы, в то время как пользователь все еще можетНавигация по странице. Хорошим примером этого могут служить возможности автозаполнения путем динамической загрузки из значений базы данных для заполнения текстового поля. Принципиальное отличие между jQuery.ajax и XMLHttpRequest заключается в том, что jQuery.ajax использует XMLHttpRequest для достижения того же эффекта, но с более простымЕсли вы используете jQuery, я бы посоветовал вам придерживаться jQuery.ajax.

Answer 6

Что касается методов jQuery, .post и .get просто выполняют .ajax внутри, их цель состоит в том, чтобы абстрагироваться от некоторых ненужных опций .ajax и предоставить некоторые значения по умолчанию, соответствующие этому типу запроса. соответственно.

Я сомневаюсь, что есть разница в производительности между любым из 3.

Метод .ajax сам по себе выполняет запрос XMLHttpRequest, он будет сильно оптимизирован в соответствии с остальной частью jQuery, но, вероятно, он не будет столь же эффективным, как если бы вы настраивали все взаимодействие самостоятельно ... но в этом разница между написанием большого количества кода или написанием jQuery.ajax.