2012-11-30 39 views
7

我見過指示或要求如何從Zepto回滾到jQuery(尤其是IE)的頁面,如here on SOZepto.js official page
我也見過如何從Google託管的jQuery回退到本地站點jQuery的示例,如Modernizr.load doc page如何從Zepto回滾到Google CDN jQuery到本地jQuery?

我的問題是,我怎麼把這兩樣東西放在一起?可能也沒有使用Modernizr.load,只需使用合適的<script>塊?

這是我想出來的,但似乎IE從來沒有找到谷歌託管版本。另外,我不確定Zepto = jQuery作業是否正常工作。

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

有沒有更好的方法? TA

編輯

@Ashfame的答案後,這是我用過:

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

我無法使用谷歌CDN的協議不太/方案少網址爲某種原因,它不適用於我的本地IE9(它等待很多,然後總是回落到本地)。

我沒有別名ZeptojQuery:在JS代碼中只使用$

我似乎沒有遇到與jQuery加載亂序w.r.t有關的任何問題。依賴代碼。

+0

我也試過'//ajax.googleapis.com/...',這是沒有協議前綴 – superjos

+0

也嘗試了[這個片段](https://gist.github.com/3325940)可能由用戶@SébastienGrosjean - ZenCocoon:它似乎工作正常,但後來我不想使用Cloudflare CDN,也沒有任何其他Zepto CDN。 – superjos

+0

也試過用'Modernizr.load',但不知何故,它似​​乎有點太多了。我當然可能是錯的。 – superjos

回答

6

對於嘗試這種技術出來的緣故,我先試試這樣:

我寫了這一起的HTML5樣板如何加載本地運行的時候jQuery的CDN是向下行快。

這可能行不通,但我沒有看到任何理由爲什麼現在不應該。想給它一個旋轉?

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

它不會很好地處理的唯一情況是當用戶在同一時間jQuery的CDN是下一個非的Zepto兼容的瀏覽器如IE &,那麼它會嘗試再次裝入jQuery的CDN一次,然後最終回退到jQuery的本地副本。


但實際上,如果我要實現這一點,我將只有一個單一的回退到本地。像嘗試檢查我們是否可以加載Zepto或jQuery,並且在下一步中,如果它們都未加載,請加載本地庫。最好是有一些適當的工作,而不是試圖優化一些不會帶來太多收益的東西。優化明智!上述技術#1可能很有可能擁有自己的跨瀏覽器兼容性的標籤。


我剛剛發現了這個問題,它說,即使這種技術(正在使用&通過HTML5樣板Modernizr的&建議)是不可靠的。檢查這個問題 - document.write fallback causing jQuery to load out of order

該問題的另一個解決方案談論圖書館Yepnope。你可以檢查它是如何工作的 - https://stackoverflow.com/a/12323328/551713

最後,我會結束這個答案,除非你正在構建一些完全是你的代碼的東西,比如沒有在用戶的可能性上加入更多的東西頁面,不要爲此煩惱,因爲你會很快遇到這種技術的問題,因爲其他腳本可能無序加載並導致問題,而如果它包含所有代碼,則可以使所有工作都加載爲&根據你的回退邏輯。

+0

感謝您的回答。最後,我使用了您的版本,但只是刪除了Google CDN上的兩次嘗試。在我的情況下:如果它第一次工作,沒問題,否則爲了提高速度(使用CDN的主要目的),它只會用於本地jQuery。 – superjos