Cómo cargar el JavaScript

Como ya tenemos entendido, el javascript bloquea los contenidos a la carga de la web. Para evitar esto podemos hacerlo con otros código de javascript (ya mostrados en otras entradas). Hoy os voy a mostrar dos, luego el uso de uno u otro cada uno con su criterio. Como un pequeño dato otra buena utilidad de estos códigos es que también tienen la posibilidad de cargar CSS sin ningún problema.

function loadScript(url, callback){
  var script = document.createElement("script")
  script.type = "text/javascript";
  if (script.readyState){ // Internet Explorer
    script.onreadystatechange = function(){
      if (script.readyState == "loaded" || script.readyState == "complete") {
        script.onreadystatechange = null;
        callback();
      }
    };
  } else { // Otros navegadores
    script.onload = function(){
    callback();
  };
}
script.src = url;
document.getElementsByTagName("head")[0].appendChild(script);
}


Con está función ya podríamos cargar los elementos js en la cabecera head de la siguiente forma
<script type="text/javascript" src="js/funcionAnterior.js"></script>
<script type="text/javascript">
     loadScript("jst/fichero1.js", function(){ });
     loadScript("js/fichero2.js", function(){ });
</script>


jQuery también tiene una función que realiza el mismo trabajo, se ejecuta de la siguiente manera.

$.getScript("test.js");

De está también tenemos la posibilidad de que ejecute un código cuando termine su carga.

$.getScript("test.js", function(){

    alert("Script está cargado y ejecutado.");

});

un saludo ;)