¿Qué diferencia hace el uso de varios bloques de script en una página web?

Question

Editar: Como Andrew Moore señaló que esta pregunta es un duplicado de Two separate script tags for Google Analytics? Por lo que esta pregunta debe eliminarse para evitar saturar el desbordamiento de pila, a menos que exista un punto para mantener este, ya que probablemente aparecerá en búsquedas ligeramente diferentes.

¿Qué importancia tiene utilizar más de un bloque de script en una página web? He pegado el código estándar para incluir Google Analytics como ejemplo, y he visto el mismo patrón utilizado en otros lugares. ¿Por qué este código se divide en dos bloques de script separados en lugar de simplemente usar uno solo?

<script type="text/javascript"> 
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); 
    document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); 
</script> 
<script type="text/javascript"> 
    try{ 
     var pageTracker = _gat._getTracker("UA-xxxxxx-x"); 
     pageTracker._trackPageview(); 
    } catch(err) {} 
</script> 

Answer 1

El segundo <script> contiene el código que depende de la carga google-analytics.com/ga.js.

Las secuencias de comandos no diferidas se ejecutan en el orden en que existen en el DOM.

La primera <script> inyecta una nueva <script> de sí mismo (con la src señalando de Google ga.js) que inmediatamente se carga y ejecuta - Sólo entonces el segundo <script> se ejecutan.

Answer 2

En el ejemplo, el primer bloque de script utiliza document.write escribir otro elemento de script, que carga un script externo, y luego el segundo elemento de secuencia de comandos utiliza cosas definidas en ese script externo. Estoy bastante seguro de que es necesario dividirlo en dos bloques de scripts para que funcione.

Si no está utilizando trucos tan extraños, poner varios bloques de secuencias de comandos en una fila generalmente no hará nada especial. Tenerlos en diferentes partes de la página es útil cuando quieres que los scripts se ejecuten mientras el documento se está cargando. Si su página es muy larga, es posible que desee que se ejecute algún script mientras se está cargando, para inicializar las cosas lo antes posible. La sustitución de elementos con widgets debe realizarse lo antes posible para evitar que las cosas salten cuando la página finalmente termine de cargarse.

Answer 3

Si el código en los primeros bloques termina con una excepción, la segunda parte también funcionará.

Answer 4

<script> etiquetas se ejecutan en secuencia. Un bloque <script> no se puede ejecutar si el anterior no se ha terminado de ejecutar.

La primera etiqueta <script> se encarga de crear la etiqueta Google <script> que cargará el js externo. Después de la primera <script> ha terminado la ejecución, el DOM tiene el siguiente aspecto:

<script></script> <!-- First Script Tag --> 
<script></script> <!-- Google Injected Script --> 
<script></script> <!-- Second Script Tag --> 

Esto garantiza que la segunda <script> etiqueta no se ejecutará hasta que el .js se realiza la carga. Si se combinan el primero y el segundo <script>, esto provocaría que la variable _gat no esté definida (ya que el script de Google inyectado no comenzará a cargarse hasta que el primer script se haya ejecutado).