Che differenza fa usare diversi blocchi di script su una pagina web?

Question

Modifica: come Andrew Moore ha sottolineato che questa domanda è una copia di Two separate script tags for Google Analytics? Quindi questa domanda dovrebbe essere cancellata per evitare ingombri di Stack Overflow, a meno che non vi sia un punto in cui mantenere questo, poiché probabilmente si presenterà in ricerche leggermente diverse.

Che differenza fa utilizzare più di un blocco di script su una pagina Web? Ho incollato il codice standard per includere Google Analytics come esempio e ho visto lo stesso pattern utilizzato in altri posti. Perché questo codice è separato in due blocchi di script separati invece di utilizzarne 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

Il secondo <script> contiene il codice che dipende dal caricamento google-analytics.com/ga.js.

Gli script non differiti vengono eseguiti nell'ordine in cui esistono nel DOM.

Il primo <script> inietta una nuova <script> dopo stesso (con il src indicando ga.js di Google) che da subito i carichi ed esegue - solo allora la seconda <script> vengono eseguiti.

Answer 2

Nel tuo esempio, il primo blocco di script utilizza document.write per scrivere un altro elemento script che carica uno script esterno, e quindi il secondo elemento script utilizza cose definite in quello script esterno. Sono abbastanza sicuro che dividerlo in due blocchi di script è necessario per farlo funzionare.

Se non si utilizzano questi strani bizzarri, l'inserimento di più blocchi di script di solito non fa nulla di speciale. Averli in diverse parti della pagina è utile quando vuoi che gli script vengano eseguiti mentre il documento si sta caricando. Se la tua pagina è molto lunga, potresti volere che alcuni script vengano eseguiti mentre è ancora in fase di caricamento, per inizializzare le cose il prima possibile. Sostituire gli elementi con i widget dovrebbe essere fatto il prima possibile per evitare che qualcosa vada in giro quando alla fine la pagina finisce di caricarsi.

Answer 3

Se il codice nei primi blocchi termina con un'eccezione, anche la seconda parte funzionerà.

Answer 4

<script> i tag vengono eseguiti in sequenza. Un blocco <script> non può essere eseguito se il precedente non è stato eseguito.

Il primo tag <script> è responsabile della creazione del tag Google <script> che caricherà i j esterni. Dopo il primo <script> è terminato l'esecuzione, il DOM è simile al seguente:

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

Ciò garantisce che il secondo tag <script> non eseguirà fino a quando il .js è fatto caricare. Se il primo e il secondo <script> fossero combinati, ciò farebbe sì che la variabile _gat non sia definita (poiché lo script di Injected di Google non inizierà il caricamento fino all'esecuzione del primo script).