Come caricare javascript da un CDN con un fallback locale nel <head>

Desidero utilizzare Head JS per caricare in modo dinamico tutti gli altri script per le mie pagine. Sto pensando di utilizzare la versione ospitata da CDNJS per sfruttare il caching migliore, la latenza ridotta, ecc.Come caricare javascript da un CDN con un fallback locale nel <head>

Non ho motivo di pensare che CDNJS stia andando ovunque, ma anche per i file ospitati da Google CDN come jQuery, I piace includere un fallback. Tuttavia, quando utilizzo jQuery, i file sono inclusi alla fine del tag <body>. A causa della natura di Head JS, devo includerlo nello <head> della mia pagina.

Nel <body> vorrei utilizzare due righe come questo:

<script src="http://cdnjs.cloudflare.com/ajax/libs/headjs/0.96/head.min.js"></script> 
<script> window.head || document.write('<script src="js/libs/head-0.96.min.js"><\/script>') </script>

È possibile utilizzare la stessa serie di linee nella testa come ripiego? document.write() non sovrascriverà la mia intera pagina? Gli script non vengono caricati diversamente quando esistono nello <head> a causa dell'ordine con cui i browser analizzano il DOM?

Sono ancora abbastanza nuovo in questo, quindi qualsiasi guida sarebbe estremamente utile! Grazie!

fonte

2012-07-20 stevenem

document.write distrugge il documento solo se si prova a farlo DOPO il caricamento della pagina è stato completato. Un documento in linea.write verrà eseguito come la pagina caricata/analizzata e semplicemente inserirà i dati scritti nel documento così come sono. –

sì, ma il capo JS non carica le chiamate che si trovano nel ' incendio _prima_ lo script viene caricato da un documento.write? – stevenem

solo se hai marcato il precedente tag script come 'async'. Altrimenti gli script vengono caricati in modo sincrono. –

Come probabilmente già saprete, non testerete per window.jQuery ma alcune funzioni incluse in head.js.

Inoltre, hai ragione che potresti non voler utilizzare lo document.write() due volte qui.

Invece di document.write(), provate questo:

function appendScript(url) { 
    var head = document.getElementsByTagName('head')[0]; 
    var theScript = document.createElement('script'); 
    theScript.type = 'text/javascript'; 
    theScript.src = url; 
    theScript.onreadystatechange = callback; 
    theScript.onload = callback; 
    head.appendChild(theScript); 
}

per l'URL, utilizzare il fallback locale.

fonte

2012-07-20 17:24:35

Grazie per aver segnalato la parte di jQuery! Darò a questo uno colpo! Come configurare il callback per eseguire i comandi 'head.js()' dopo il caricamento di Head JS? – stevenem

Non ne sono sicuro, non so molto su head.js, ma non so se si potrebbe garantire che ciò avvenga prima o dopo head.js in base alla progettazione. –

Come caricare javascript da un CDN con un fallback locale nel <head>

risposta

Problemi correlati