javascript - paginas - Cargando scripts después de cargar la página?

funcion load javascript

Question

Trabajo con una empresa de publicidad, donde etiquetamos ciertas páginas para rastrear la actividad. Un cliente mío desea activar una etiqueta javascript para rastrear la actividad DESPUÉS de que la página haya terminado de cargarse por completo (para evitar que el contenido de la página se cargue lentamente debido a los tiempos de carga de etiquetas lentas).

Una etiqueta de ejemplo que debe cargarse DESPUÉS de que la página se haya cargado completamente es:

<script>document.write(''<s''+''cript language="JavaScript" src="http://jact.atdmt.com/jaction/JavaScriptTest"></s''+''cript>'')</script>

Estaba viendo algunos hilos de stackoverflow y encontré la siguiente implementación que creo que funcionará:

window.onload = function(){
  <script language="JavaScript" src="http://jact.atdmt.com/jaction/JavaScriptTest"></script>
};

Probé esto en mi propia página web y conseguí que se activara la etiqueta, pero me pregunto si hay algún método alternativo o más robusto, idealmente utilizando jQuery de algún tipo.

A continuación se muestra una implementación de muestra que el cliente probó, pero parece romper su página:

<script>
jQuery(window).load(function () {$(''<script language="JavaScript" src="http://jact.atdmt.com/jaction/JavaScriptTest"></script>'').insertAfter(''#div_name'');});
</script>

No he hecho JQuery en un tiempo y esperaba poder obtener información de otros miembros aquí. ¿Hay alguna otra manera en que pueda llamar al script anterior después de cargar la página usando JQuery?

Gracias,

Answer 1

Centrándose en una de las soluciones jQuery de la respuesta aceptada , $.getScript() es una solicitud .ajax() encubierta . Permite ejecutar otra función en caso de éxito agregando un segundo parámetro:

$.getScript(url, function() {console.log(''loaded script!'')})

O en los propios controladores de la solicitud, es decir, éxito ( .done() : se cargó el script) o error ( .fail() ):

$.getScript(
    "https://code.jquery.com/color/jquery.color.js",
    () => console.log(''loaded script!'')
  ).done((script,textStatus ) => {
    console.log( textStatus );
    $(".block").animate({backgroundColor: "green"}, 1000);
  }).fail(( jqxhr, settings, exception ) => {
    console.log(exception + '': '' + jqxhr.status);
  }
);

.block {background-color: blue;width: 50vw;height: 50vh;margin: 1rem;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="block"></div>

Answer 2

El segundo enfoque es correcto para ejecutar el código JavaScript después de que la página haya terminado de cargarse, pero en realidad no se ejecuta el código JavaScript allí, se insertó el HTML plano.
Lo primero funciona, pero carga el JavaScript inmediatamente y borra la página (para que su etiqueta esté allí, pero nada más).
(Más: language = "javascript" ha estado en desuso durante años, use en su lugar type = "text / javascript")

Para que funcione, debe utilizar los métodos de manipulación de DOM incluidos en JavaScript. Básicamente necesitarás algo como esto:

var scriptElement=document.createElement(''script'');
scriptElement.type = ''text/javascript'';
scriptElement.src = filename;
document.head.appendChild(scriptElement);

Answer 3

Entonces, no hay manera de que esto funcione:

window.onload = function(){
  <script language="JavaScript" src="http://jact.atdmt.com/jaction/JavaScriptTest"></script>
};

No puedes soltar HTML en medio de javascript.

Si tienes jQuery, puedes usar:

$.getScript("http://jact.atdmt.com/jaction/JavaScriptTest")

cuando quieras. Si desea asegurarse de que el documento haya terminado de cargarse, puede hacer esto:

$(document).ready(function() {
    $.getScript("http://jact.atdmt.com/jaction/JavaScriptTest");
});

En javascript plano, puede cargar un script dinámicamente en cualquier momento que desee de esta manera:

var tag = document.createElement("script");
tag.src = "http://jact.atdmt.com/jaction/JavaScriptTest";
document.getElementsByTagName("head")[0].appendChild(tag);

Answer 4

Esta es una etiqueta Atlas Action JS. El proveedor debería haber proporcionado algunos documentos al cliente con algunas pautas sobre las mejores prácticas para implementar la etiqueta en la página de conversión. Debe solicitar al cliente para esta documentación o contacto del proveedor para solicitarlos directamente.

Answer 5

<script type="text/javascript">
$(window).bind("load", function() { 

// your javascript event

)};
</script>