Método getScript() de jQuery ajax

Ejemplo

Obtener y ejecutar un archivo JavaScript mediante una solicitud AJAX:

$("button").click(function(){
  $.getScript("demo_ajax_script.js");
});

Prueba personal

Definición y uso

El método getScript() carga y ejecuta un archivo JavaScript mediante una solicitud GET HTTP.

Sintaxis

jQuery.getScript(url,success(respuesta,estado});
Parámetros Descripción
url La cadena de caracteres de URL que se solicitará.
success(respuesta, estado)

Opcional. Define la función de devolución de llamada que se ejecutará después del éxito de la solicitud.

Parámetros adicionales:

  • respuesta - Incluye los datos de resultado de la solicitud
  • estado - Incluye el estado de la solicitud ("éxito", "no modificado", "error", "tiempo de espera" o "parsererror")

Descripción detallada

Esta función es una versión abreviada de la función Ajax, equivalente a:

$.ajax({
  url: url,
  dataType: "script",
  éxito: éxito
});

La función de devolución de llamada aquí recibirá el archivo JavaScript devuelto. Esto no suele ser muy útil, porque en ese momento el script ya se ha ejecutado.

El script cargado se ejecuta en el ámbito global, por lo que puede referenciar otras variables y usar funciones de jQuery.

Por ejemplo, carga un archivo test.js que contiene el siguiente código:

$(".result").html("<p>Lorem ipsum dolor sit amet.</p>");

Puedes cargar y ejecutar este script mediante la referencia de este nombre de archivo:

$.getScript("ajax/test.js", function() {
  alert("Se realizó la carga.");
});

Notas:Antes de la versión 1.2 de jQuery, getScript solo podía llamar a archivos JS del mismo dominio. En la versión 1.2, puedes llamar a archivos JavaScript de dominios diferentes. Nota: Safari 2 o versiones anteriores no pueden ejecutar scripts en el ámbito global de manera síncrona. Si se agrega un script mediante getScript, se debe agregar una función de demora.

Más ejemplos

Ejemplo 1

Carga y ejecuta test.js:

$.getScript("test.js");

Ejemplo 2

Carga y ejecuta test.js, luego muestra el mensaje:

$.getScript("test.js", function(){
  alert("Script cargado y ejecutado.");
});

Ejemplo 3

Carga Plugin de animación de color oficial de jQuery Después de que se realice con éxito, se binda la animación de cambio de color:

Código HTML:

<button id="go">Ejecutar</button>
<div class="block"></div>

Código de jQuery:

jQuery.getScript("http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js",
 function(){
  $("#go").click(function(){
    $(".block").animate({ backgroundColor: 'pink' }, 1000)
      .animate({ backgroundColor: 'blue' }, 1000);
  });
});