Diferença entre $ .ajax () e $ .get () e $ .load ()

Qual é a diferença entre $.ajax() e $.get() e $.load() ?

Qual é melhor para usar e em que condições?

$.ajax() é o mais configurável, onde você obtém um controle refinado sobre headers HTTP e outros. Você também pode obter access direto ao object XHR usando esse método. Um tratamento de erros ligeiramente mais refinado também é fornecido. Pode, portanto, ser mais complicado e muitas vezes desnecessário, mas às vezes muito útil. Você precisa lidar com os dados retornados com um retorno de chamada.

$.get() é apenas uma forma abreviada de $.ajax() mas abstrai algumas das configurações, definindo valores padrão razoáveis ​​para o que esconde de você. Retorna os dados para um retorno de chamada. Ele só permite solicitações GET, portanto, é acompanhado pela function $.post() para abstração semelhante, somente para POST

.load() é semelhante a $.get() mas adiciona funcionalidade que permite definir onde no documento os dados retornados devem ser inseridos. Portanto, realmente só é utilizável quando a chamada só irá resultar em HTML. Ele é chamado de forma ligeiramente diferente das outras chamadas globais, pois é um método vinculado a um determinado elemento DOM envolvido em jQuery. Portanto, um faria: $('#divWantingContent').load(...)

Deve-se notar que todos os $.get() , $.post() , .load() são apenas wrappers para $.ajax() como é chamado internamente.

Mais detalhes na documentação do Ajax do jQuery: http://api.jquery.com/category/ajax/

Os methods fornecem diferentes camadas de abstração.

  • $.ajax() lhe dá controle total sobre a solicitação do Ajax. Você deve usá-lo se os outros methods não atenderem às suas necessidades.

  • $.get() executa uma solicitação Ajax GET . Os dados retornados (que podem ser quaisquer dados) serão passados ​​para seu manipulador de retorno de chamada.

  • $(selector).load() executará uma solicitação Ajax GET e definirá o conteúdo dos dados retornados selecionados (que devem ser texto ou HTML).

Depende da situação que método você deveria usar. Se você quiser fazer coisas simples, não há necessidade de se preocupar com $.ajax() .

Por exemplo, você não usará $.load() , se os dados retornados forem JSON, que precisam ser processados ​​posteriormente. Aqui você usaria $.ajax() ou $.get() .

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

jQuery.ajax()

Descrição: Execute uma solicitação HTTP (Ajax) assíncrona.

A assembly completa permite que você faça qualquer tipo de solicitação Ajax.


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

jQuery.get()

Descrição: Carrega dados do servidor usando uma solicitação HTTP GET.

Só permite fazer solicitações HTTP GET, requer um pouco menos de configuração.


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

.load()

Descrição: carregue os dados do servidor e coloque o HTML retornado no elemento correspondente.

Especializado para obter dados e injetá-lo em um elemento.

Muito básico, mas

  • $.load() : Carrega um pedaço de html em um DOM de container.
  • $.get() : Use isto se você quiser fazer uma chamada GET e tocar bastante com a resposta.
  • $.post() : Use isto se você quiser fazer uma chamada POST e não quiser carregar a resposta para algum DOM de container.
  • $.ajax() : Use isto se você precisar fazer alguma coisa quando o XHR falhar, ou você precisa especificar opções ajax (por exemplo, cache: true) na hora.

Nota importante: O método jQuery.load () pode fazer não apenas solicitações GET, mas também POST , se o parâmetro de dados for fornecido (consulte: http://api.jquery.com/load/ )

data Tipo: PlainObject or String Um object simples ou uma string que é enviada ao servidor com a solicitação.

Método de Solicitação O método POST é usado se os dados forem fornecidos como um object; caso contrário, GET é assumido.

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

Todo mundo está certo. Funções .load , .get e .post são maneiras diferentes de usar a function .ajax .

Pessoalmente, eu acho a function raw .ajax muito confusa, e prefiro usar load, get, ou post como preciso.

O POST tem a seguinte estrutura:

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

GET tem o seguinte:

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

LOAD tem o seguinte:

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

Como você pode ver, existem pequenas diferenças entre eles, porque é a situação que determina qual deles usar. Precisa enviar as informações para um arquivo internamente? Use .post (isso seria a maioria dos casos). Precisa enviar as informações de forma que você possa fornecer um link para o momento específico? Use .get. Ambos permitem um retorno de chamada onde você pode manipular a resposta dos arquivos.

Uma nota importante é que o .load age de duas maneiras diferentes. Se você apenas fornecer a url do documento de destino, ele funcionará como um get (e eu digo age porque testei a verificação de $_POST no PHP chamado enquanto usava o comportamento padrão .load e ele detecta $_POST , não $_GET ; talvez seria mais preciso dizer que atua como .post sem quaisquer argumentos); no entanto, como diz http://api.jquery.com/load/ , uma vez que você forneça uma matriz de argumentos para a function, ela publicará as informações no arquivo. Seja qual for o caso, a function .load inserirá diretamente as informações em um elemento DOM, que em muitos casos é muito legível e muito direto; mas ainda fornece um retorno de chamada se você quiser fazer algo mais com a resposta. Além disso, o .load permite que você extraia um determinado bloco de código de um arquivo, dando a você a possibilidade de salvar um catálogo, por exemplo, em um arquivo html, e recuperar partes dele (itens) diretamente nos elementos DOM.

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

$.load() é uma function auxiliar que só pode ser invocada em elementos.

$.ajax() lhe dá mais controle. você pode especificar se deseja enviar dados POST, receber mais callbacks etc.

Todos explicaram o tópico muito bem. Há mais um ponto que gostaria de adicionar sobre o método .load ().

Conforme o documento Load, se você adicionar um seletor com sufixo na URL de dados, ele não executará scripts ao carregar o conteúdo.

Plunker de trabalho

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

Por outro lado, depois de remover o seletor no URL, os scripts em novo conteúdo serão executados. Experimente este exemplo

depois de remover #content em url no arquivo index.html

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

Não existe esse recurso embutido fornecido por outros methods em discussão.

Ambos são usados ​​para enviar alguns dados e receber alguma resposta usando esses dados.

OBTER : Obtenha informações armazenadas no servidor. (ou seja, busca, tweet, informação pessoal). Se você quiser enviar informações, então, obter pedido enviar solicitação usando process.php?name=subroto Então, basicamente, envia informações através do URL. O URL não pode lidar com mais de 2036 caracteres. Então, para o blog, você pode lembrar que não é possível?

POST : Post faz a mesma coisa que GET. Registro do usuário, login do usuário, envio de Big Data, postagem no blog. Se você precisar enviar informações seguras, use o post ou para big data, já que ele não passa pelo URL.

AJAX : $.get() e $.post() contêm resources que são subconjuntos de $.ajax() . Tem mais configuração.

Método $.get () , que é um tipo de atalho para $.ajax() . Ao usar $.get () , em vez de passar um object, você passa argumentos. No mínimo, você precisará dos dois primeiros argumentos, que são a URL do arquivo que você deseja recuperar (por exemplo, test.txt) e um retorno de chamada bem-sucedido.