引入外部 CDN失效時--怎么加載本地資源文件（本文以jquery為例）

 

　　相信大家都使用過CDN靜態資源庫，比如下面

　　staticfile CDN：http://staticfile.org    （由國內優秀的雲存儲服務商七牛雲提供存儲和加速贊助）

　　BootCDN：https://www.bootcdn.cn/  （Bootstrap中文網支持並維護的前端開源項目免費 CDN 服務）

　　CDN官方靜態資源庫：https://cdnjs.com/

　　

　　使用CDN可以減少帶寬和http請求，也可以減少一些服務器的壓力，從而提升頁面加載速度，用戶體驗也會更好。

　　但有一個問題：假如你使用的是百度靜態資源庫。

　　某天，突然百度靜態資源庫崩了，那你網站引用的相應資源文件也會失效。這個時候應該怎么辦呢？

　　雖然這種情況幾率比較小，但為了防范於未然，我們還是需要留一手。

 

　　然后我就開始百度方法，真是五花八門，各種寫法都有，看的我是很蒙蔽

　　有這種：

<script src="//ajax.google/jquery/1.9.2.js"></script>
<script>window.jQuery||document.write('<script src="jquery-1.9.2.js"></script>')</script>

 

　　有這種：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script>!window.jQuery && document.write(unescape('%3Cscript src="jquery/jquery-1.7.2.min.js"%3E%3C/script%3E'))</script>

　　

　　有這種：

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.min.js "></script>
<script>
　　//<![CDATA[
    if(typeof jQuery == 'undefined') { document.write(unescape("%3Cscript src='/Script/jquery-1.4.1.min.js' type='text/javascript' %3E%3C/script%3E")); } //]]>
</script>

 

　　不知為何，總覺得以上寫法哪里不對，但又說不出個所以然。后經過一番尋找，終於找到了比較規范和正確的2種方法

　　方法一（推薦）

<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
 if (typeof jQuery == 'undefined') { 　　document.write(unescape("%3Cscript src='/skin/mobile/js/jquery.min.js'%3E%3C/script%3E")); } </script>

　　方法二

<script src="http://lib.sinaapp.com/js/jquery11/1.8/jquery.min.js"></script>
<script>window.jQuery || document.write(unescape("%3Cscript src='/skin/mobile/js/jquery.min.js'%3E%3C/script%3E"))</script>

 

 

　　注：經本人實際測試，2種方法都可以。

　　然后這里我又有一個疑問：不知道上面代碼中的 %3C 和 %3E是什么意思？

　　后來先查了 unescape()這個函數  ， 接着又查了這個函數escape() 

　　

　　結果發現 %3C 和 %3E分別表示 '<'  和  '>'，如下圖

　　

 

 　　

 

 　　原文參考：https://www.jb51.net/article/140694.htm