Разница между $ .ajax () и $ .get () и $ .load ()

Ответы:

241

$.ajax()является наиболее настраиваемым, где вы получаете точный контроль над заголовками HTTP и тому подобное. Вы также можете получить прямой доступ к XHR-объекту, используя этот метод. Чуть более тонкая обработка ошибок также предоставляется. Поэтому может быть более сложным и часто ненужным, но иногда очень полезным. Вы должны разобраться с возвращенными данными самостоятельно с помощью обратного вызова.

$.get()это просто сокращение, $.ajax()но он абстрагирует некоторые конфигурации, устанавливая разумные значения по умолчанию для того, что он скрывает от вас. Возвращает данные для обратного вызова. Это позволяет только GET-запросы, поэтому сопровождается $.post()функцией для аналогичной абстракции, только для POST

.load()аналогично, $.get()но добавляет функциональность, которая позволяет вам определить, куда в документе следует вставить возвращаемые данные. Поэтому действительно можно использовать только тогда, когда вызов приведет к HTML. Он вызывается немного иначе, чем другие глобальные вызовы, поскольку это метод, привязанный к конкретному элементу DOM в JQuery-оболочке. Следовательно, можно сделать:$('#divWantingContent').load(...)

Следует отметить , что все $.get(), $.post(), .load()все просто обертки для $.ajax()как это называется внутренне.

Более подробно в Ajax-документации jQuery: http://api.jquery.com/category/ajax/

Александр Саген
источник
3
@UzairAli нет, он буквально берет переменные, которые вы передаете ему, и использует их для выполнения jQuery.ajax ()
lisburnite
1
Отлично, .load () - это просто HTML, а .get () полезен для большего количества вещей.
Луиджи Лопес
30

Методы предоставляют разные уровни абстракции.

  • $.ajax()дает вам полный контроль над запросом Ajax. Вы должны использовать его, если другие методы не удовлетворяют вашим потребностям.

  • $.get()выполняет запрос Ajax GET. Возвращенные данные (которые могут быть любыми данными) будут переданы вашему обработчику обратного вызова.

  • $(selector).load()выполнит запрос Ajax GETи установит содержимое выбранных возвращаемых данных (которое должно быть либо текстом, либо HTML).

Это зависит от ситуации, какой метод вы должны использовать. Если вы хотите делать простые вещи, вам не нужно беспокоиться о$.ajax() .

Например, вы не будете использовать $.load(), если возвращаемые данные будут в формате JSON, который необходимо обрабатывать дальше. Здесь вы будете использовать $.ajax()или $.get().

Феликс Клинг
источник
9

http://api.jquery.com/jQuery.ajax/

jQuery.ajax()

Описание: Выполните асинхронный HTTP-запрос (Ajax).

Полный Monty, позволяет вам делать любые запросы Ajax.


http://api.jquery.com/jQuery.get/

jQuery.get()

Описание: загрузка данных с сервера с помощью HTTP-запроса GET.

Только позволяет вам делать запросы HTTP GET, требует чуть меньше настроек.


http://api.jquery.com/load/

.load()

Описание: загрузить данные с сервера и поместить полученный HTML-код в соответствующий элемент.

Специализируется на получении данных и внедрении их в элемент.

децезе
источник
8

Очень простой, но

  • $.load(): Загрузите кусок HTML в контейнер DOM.
  • $.get(): Используйте это, если вы хотите сделать GET- вызов и активно играть с ответом.
  • $.post()Используйте это, если вы хотите сделать POST- вызов и не хотите загружать ответ на некоторый контейнер DOM.
  • $.ajax()Используйте это, если вам нужно что-то сделать, когда XHR не работает, или вам нужно указать параметры ajax (например, cache: true) на лету.
Тим
источник
5

Важное примечание: метод jQuery.load () может выполнять не только запросы GET, но и запросы POST , если указан параметр data (см .: http://api.jquery.com/load/ ).

Тип данных : PlainObject или String Простой объект или строка, отправляемая на сервер с запросом.

Метод запроса Метод POST используется, если данные предоставляются в виде объекта; в противном случае, GET предполагается.

Example: pass arrays of data to the server (POST request)
$( "#objectID" ).load( "test.php", { "choices[]": [ "Jon", "Susan" ] } );
pymen
источник
3

Каждый имеет это право. Функции .load, .getи .post, являются различными способами использования функции.ajax .

Лично я нахожу функцию .ajax raw очень запутанной и предпочитаю использовать load, get или post по мере необходимости.

POST имеет следующую структуру:

$.post(target, post_data, function(response) { });

GET имеет следующее:

$.get(target, post_data, function(response) { });

LOAD имеет следующее:

$(*selector*).load(target, post_data, function(response) { });

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

Важным примечанием является то, что .load действует двумя различными способами. Если вы предоставите только URL целевого документа, он будет действовать как get (и я говорю act, потому что я проверял проверку $_POSTв вызываемом PHP при использовании поведения по умолчанию .load и обнаруживает $_POST, а не$_GET ; возможно, это было бы более точным для говорят, что он действует как .post без каких-либо аргументов); однако, как http://api.jquery.com/load/говорит, что, как только вы предоставите массив аргументов функции, она отправит информацию в файл. Как бы то ни было, функция .load будет напрямую вставлять информацию в элемент DOM, что в МНОГИХ случаях очень разборчиво и очень прямолинейно; но все равно обеспечивает обратный вызов, если вы хотите сделать что-то еще с ответом. Кроме того, .load позволяет извлекать определенный блок кода из файла, давая вам возможность сохранить каталог, например, в html-файле, и извлечь его части (элементы) непосредственно в элементы DOM.

Исаак Леви Феликс Салинас
источник
3
$.get = $.ajax({type: 'GET'});

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

$.ajax()дает вам больше всего контроля. Вы можете указать, хотите ли вы отправлять данные, получать больше обратных вызовов и т. д.

jgauffin
источник
1

Оба используются для отправки некоторых данных и получения ответа с использованием этих данных.

GET : получить информацию, хранящуюся на сервере. (то есть поиск, твит, информация о человеке). Если вы хотите отправить информацию, то получите запрос на отправку запроса, используя process.php?name=subrotoТак что он в основном отправляет информацию через URL. URL не может обрабатывать более 2036 символов. Так что для сообщения в блоге вы можете вспомнить, что это невозможно?

POST : Post делает то же самое, что и GET. Регистрация пользователя, логин пользователя, отправка больших данных, запись блога. Если вам нужно отправить защищенную информацию, используйте почту или большие данные, поскольку они не проходят через URL.

AJAX : $.get()и $.post()содержат функции, которые являются подмножествами $.ajax(). У него больше настроек.

$.get ()метод, который является своего рода сокращением для $.ajax(). При использовании $.get ()вместо передачи объекта вы передаете аргументы. Как минимум, вам понадобятся первые два аргумента: URL-адрес файла, который вы хотите получить (например, test.txt) и обратный вызов.

Subroto Biswas
источник
0

Все очень хорошо объяснили тему. Есть еще один момент, который я хотел бы добавить о методе .load ().

В соответствии с документом Load, если вы добавите суффиксный селектор в URL-адрес данных, он не будет выполнять сценарии при загрузке содержимого.

Рабочий Плункер

            $(document).ready(function(){
                $("#secondPage").load("mySecondHtmlPage.html #content");
            })

С другой стороны, после удаления селектора в URL, скрипты в новом контенте будут работать. Попробуйте этот пример

после удаления #content в URL в файле index.html

            $(document).ready(function(){
                $("#secondPage").load("mySecondHtmlPage.html");
            })

В обсуждении нет такой встроенной функции, предоставляемой другими методами.

Дипак Кумар
источник