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

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

Ответ 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() для всего вашего запроса, но вам придется написать немного больше кода, потому что ему нужно немного больше вариантов для его вызова.

Аналогия

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

Ответ 2

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

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

Ответ 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, в мобильном устройстве потребуется много времени, чтобы загрузить простой сайт.

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

Ответ 4

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

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

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

Ответ 5

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

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