Fazendo solicitações JSONP a partir de JavaScript sem bibliotecas externas

Para solicitações JSONP entre domínios em JavaScript, bibliotecas externas como jQuery nem sempre são necessárias. Aqui está um guia para fazer isso usando JavaScript puro:

Etapa 1: Crie uma função de retorno de chamada

Comece definindo uma função de retorno de chamada para receber e processar a resposta JSONP. No exemplo fornecido, a função foo executa esta tarefa:

function foo(data) {
  // Do something with the JSON response here
}

Etapa 2: Criar dinamicamente um elemento de script

Em seguida, crie um elemento

var script = document.createElement('script');
script.src = '//example.com/path/to/jsonp?callback=foo';

Etapa 3: anexar o elemento Script ao DOM

Uma vez que o elemento

document.getElementsByTagName('head')[0].appendChild(script);

Para navegadores modernos, você pode simplificar esta linha para:

document.head.appendChild(script);

Example

Reunindo essas etapas, aqui está um exemplo completo de como fazer uma solicitação JSONP em JavaScript sem uma biblioteca externa :

function foo(data) {
  // Do stuff with JSON
}

var script = document.createElement('script');
script.src = '//example.com/path/to/jsonp?callback=foo'

document.head.appendChild(script);