2012-07-20 25 views
5

Chcę użyć Head JS, aby dynamicznie ładować wszystkie inne skrypty dla moich stron. Planuję na użyciu wersji obsługiwanego przez CDNJS do skorzystania z lepszych buforowania, zmniejszenie latencji, itpJak załadować javascript z CDN z lokalną awarią w <head>

mam żadnego powodu, by myśleć CDNJS się dzieje wszędzie, ale nawet dla Google CDN gospodarzem plików, takich jak jQuery, I lubię włączać awarię. Jednak gdy używam jQuery, pliki znajdują się na końcu znacznika <body>. Ze względu na charakter Head JS, muszę uwzględnić go w <head> mojej strony.

W <body> użyłbym dwie linie tak:

<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> 

Czy mogę korzystać z tego samego zestawu wierszy w głowie jako awaryjnej? Czy document.write() nie zastąpi mojej całej strony? Czy skrypty nie ładują się inaczej, jeśli istnieją w <head> ze względu na kolejność, w jakiej przeglądarki analizują DOM?

Nadal jestem całkiem nowy, więc wszelkie wskazówki byłyby niezwykle pomocne! Dzięki!

+1

document.write tylko niszczy dokument, jeśli spróbujesz to zrobić PO zakończeniu ładowania strony. In-line document.write zostanie wykonane jako załadowane/przeanalizowane strony i po prostu wstawi zapisane dane do dokumentu w niezmienionym stanie. –

+0

tak, ale czy wywołania ładunków JS głowicy, które znajdują się w ogniu ' _przed rozpoczęciem ładowania skryptu z pliku document.write? – stevenem

+0

tylko jeśli zaznaczyłeś poprzedni znacznik skryptu jako 'asynchroniczny'. W przeciwnym razie skrypty są ładowane synchronicznie. –

Odpowiedz

0

Jak już zapewne wiesz, nie będziesz testować pod kątem window.jQuery, ale niektóre funkcje zawarte są w head.js.

Ponadto masz rację, że nie możesz dwukrotnie używać tutaj document.write().

Zamiast document.write(), spróbuj tego:

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); 
} 

adresu URL, użyj lokalnej fallback.

+0

Dzięki za wskazanie części jQuery! Dam ci ten strzał! Jak skonfigurować wywołanie zwrotne, aby uruchomić komendy 'head.js()' po załadowaniu Head JS? – stevenem

+0

Nie jestem pewien, nie wiem zbyt wiele o head.js, ale nie wiem, czy mógłbyś zagwarantować, że będzie działał przed lub po head.js według projektu. –