2012-11-30 13 views
7

Widziałem strony, które instruują lub pytają, jak wrócić z Zepto do jQuery (szczególnie dla IE), jako here on SO i tutaj na Zepto.js official page.
Widziałem również przykłady, jak wrócić z jQuery hostowanej przez Google do lokalnej witryny jQuery, jak w Modernizr.load doc page.Jak wrócić z Zepto, do Google CDN jQuery, do lokalnego jQuery?

Moje pytanie brzmi: jak mogę połączyć te dwie rzeczy? Być może również bez użycia Modernizr.load, używając tylko odpowiednich bloków <script>?

Oto, co wymyśliłem, ale wygląda na to, że IE nigdy nie znajdzie wersji hostowanej przez Google. Ponadto nie jestem pewien, czy zadanie Zepto = jQuery działa poprawnie.

<script> 
    document.write('<script src=' + 
     ('__proto__' in {} ? 
      'js/vendor/zepto.min' : 
      'https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min') + 
     '.js><\/script>'); 
</script> 
<script> 
    if (window.jQuery) { 
     window.Zepto = window.jQuery; /* let jQuery alias Zepto */ 
    } 
    else 
    { /* here jQuery could be rightly undefined because Zepto is loaded, 
     so this could be wrong. */ 
     document.write('<script src=' + 
      'js/vendor/jquery-1.8.0.min' + 
      '.js><\/script>'); 
    } 
</script> 
<script> 
    if (window.jQuery) { 
     window.Zepto = window.jQuery; /* let jQuery alias Zepto */ 
    } 
    else 
    { 
     /* same problem as before */ 
     console.error('Zepto nor jQuery available!'); 
    } 
</script> 

Czy istnieje lepszy sposób? TA

Edit

Po @Ashfame odpowiedzi, to co Użyłem:

<!-- Load local Zepto.js or (as a fallback) jQuery from Google CDN or (as a fallback) local jQuery --> 
<script> 
    document.write('<script src="' + ('__proto__' in {} ? 
     'js/vendor/zepto' : 
     'http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery') + 
     '.min.js"><\/script>') 
</script> 
<script> 
    window.Zepto || window.jQuery || document.write('<script src="js/vendor/jquery-1.8.0.min.js"><\/script>'); 
</script> 

nie mogę użyć adresu URL protokołu mniej/schemat mniej Google CDN za z jakiegoś powodu nie działało na moim lokalnym IE9 (dużo czeka, potem zawsze wraca do lokalnego).

Nie zamieniłem już aliasu na Zepto z jQuery: właśnie użyto $ w kodzie JS.

Nie wydaje mi się, aby wystąpił problem związany z ładowaniem jQuery z zamówienia w.r.t. kod zależny.

+0

Próbowałem także z '//ajax.googleapis.com/...', to znaczy bez prefiksu protokołu – superjos

+0

Próbowałem również z [ten fragment] (https://gist.github.com/3325940) prawdopodobnie przez użytkownika @ Sébastien Grosjean - ZenCocoon: wydawało się, że działa dobrze, ale potem nie chciałem używać CDN Cloudflare ani żadnego innego Zepto CDN. – superjos

+0

Próbowano również z 'Modernizr.load', ale jakoś wydawało się to trochę za dużo do tego celu. Oczywiście mogę się mylić. – superjos

Odpowiedz

6

Dla próbuje się tę technikę, chciałbym spróbować ten pierwszy:

pisałem to szybko wzdłuż linii jak HTML5 Gotowa ładuje lokalny fallback gdy jQuery CDN jest w dół.

To może nie działać, ale nie widzę powodu, dla którego nie powinien teraz. Chcesz się zakręcić?

<script>document.write('<script src="' + ('__proto__' in {} ? 'cdn/zepto.min' : 'cdn/jquery.min') + '.js">\x3Cscript>');</script> 
<script>window.Zepto || window.jQuery || document.write('<script src="cdn/jquery.min.js">\x3C/script>')</script> 
<script>window.Zepto || window.jQuery || document.write('<script src="local/jquery.min.js">\x3C/script>')</script> 

Jedyny przypadek, to nie będzie dobrze obsłużyć jest wtedy, gdy użytkownik jest na kompatybilnej przeglądarce non-Zepto jak IE & jednocześnie jQuery CDN jest w dół, a następnie spróbuje ponownie załadować jQuery CDN raz, a potem ostatecznie w miejsce lokalnej kopii jQuery.


Ale praktycznie rzecz biorąc, gdybym wdrożyć to, chciałbym po prostu mieć 1 pojedynczą przełączenie na lokalny. Spróbuj sprawdzić, czy możemy załadować Zepto lub jQuery, aw następnym kroku, jeśli żaden z nich nie został załadowany, załaduj bibliotekę lokalną. Lepiej mieć coś na miejscu, zamiast próbować zoptymalizować coś, co nie przyniesie tak dużego zysku. Optymalizuj mądrze! Jest bardzo prawdopodobne, że powyższa technika # 1 będzie miała swoje własne granice kompatybilności między przeglądarkami.


Właśnie dowiedziałem się ten problem, gdzie jest napisane, nawet tę technikę (używanej & zalecaną przez HTML5 boilerplate & modernizr) nie jest wiarygodne.Sprawdź ten problem - document.write fallback causing jQuery to load out of order

Kolejne rozwiązanie w tym pytaniu mówi o bibliotece Yepnope. Możesz sprawdzić, jak to działa - https://stackoverflow.com/a/12323328/551713

Na koniec chciałbym zakończyć tę odpowiedź, mówiąc, że jeśli nie budujesz czegoś, co całkowicie będzie twoim kodem, jak nie bieganie w dziczy z możliwościami jego użytkownika dodawania więcej rzeczy na strona, nie przejmuj się tym zbytnio, ponieważ szybko natrafisz na problemy z takimi technikami, ponieważ inny skrypt może załadować się w nieprawidłowej kolejności i spowodować problemy, podczas gdy jeśli jest to cały twój kod, prawdopodobnie możesz sprawić, by wszystko ładowało się w następujący sposób: & według twojej logiki fallbacks.

+0

Dzięki za odpowiedź. W końcu użyłem twojej wersji, ale po prostu usunę podwójną próbę z Google CDN. W moim przypadku: jeśli działa po raz pierwszy, dobrze, inaczej ze względu na szybkość (główny cel używania CDN), to po prostu pójdzie do lokalnego jQuery. – superjos