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"); });
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:
|
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); }); });