2010-10-06 3 views
142

В чем разница между $.ajax() и $.get() и $.load()?

Какой лучше использовать и при каких условиях?

+0

Возможный дубликат [разница между $ ("# id"). Load и $ .ajax?] (Http://stackoverflow.com/questions/2076642/difference-between-id-load-and-ajax) – Athafoud

ответ

202

$.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/

+9

Существуют ли различия в производительности? –

+0

@UzairAli no, он буквально принимает переменные, которые вы передаете ему, и использует их для выполнения jQuery.ajax() – lisburnite

+0

Отлично, .load() - это просто обычный HTML, а .get() полезен для других вещей. –

2
$.get = $.ajax({type: 'GET'}); 

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

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

6

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

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

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

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

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

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

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

E.g. вы не будете использовать $.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 в совпавшего элемента.

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

3

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

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

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

Example: pass arrays of data to the server (POST request) 
$("#objectID").load("test.php", { "choices[]": [ "Jon", "Susan" ] }); 
3

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

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

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

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

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

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

НАГРУЗКИ имеет следующее:

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

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

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

0

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

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

Working Plunker

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

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

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

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

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

-1

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

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

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

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

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

Смежные вопросы