HTML if語句在CDN失敗時加載本地JS/CSS

從CDN或任何外部服務器加載CSS/JS文件時，由於外部故障可能（即使概率較低）錯過文件。在這種情況下，由於缺乏合適的CSS和JS，html頁面將被破壞。HTML if語句在CDN失敗時加載本地JS/CSS

在CDN失敗時是否有一種實用的方法來加載本地版本？

<link rel="stylesheet" href="http://cdn.com/style.css" type="text/css" /> 
IF (not loaded style.css){ 
<link rel="stylesheet" href="/css/style.css" type="text/css" media="screen" /> 
}

這對於JS來說會更容易，因爲我們可以測試一個JS函數（在JS文件中提供）;然後在失敗時加載本地文件。例如，測試，如果jQuery庫可用。

但是，我很想知道是否有一個實用的方法！

來源

2012-05-21 Googlebot

http://stackoverflow.com/questions/3794128/how-to-check-if-an-external-css-file-is-loaded-using-javascript – WojtekT

我會這樣做。

在樣式表ui-helper-hidden中創建一個類，然後在您的頁面上添加一個div作爲第一個元素;

<body><div class="ui-helper-hidden"></div><!-- rest of html --></body>

你檢查後，以確保您的CDN JavaScript文件已加載，然後使用代碼記下我使用jquery

<script> 
    // CSS Fallback 
    $(function() { 
     if ($('.ui-helper-hidden:first').is(':visible') === true) { 
      $('<link rel="stylesheet" type="text/css" href="/pathtocss/nameofstylesheet.css" />').appendTo('head'); 
     } 
    }); 
</script>

的該位這將檢查，看看是否元素應該隱藏的是不是。如果它沒有隱藏，那麼你知道你的css文件沒有從CDN加載。

我用這個方法jQuery and jQuery UI via a CDN

來源

2012-05-21 15:52:45

對於Javascript，您可以在構建動態腳本時監聽onload和onerror事件。但是，在那些相同的頁面中，它顯示的是CSS。

動態加載CSS的唯一可靠方法是通過AJAX來完成。你可能通過動態鏈接標籤加載樣式，但沒有這些事件，你不知道他們是否已經加載。你可以輪詢風格，但它是黑客海事組織。

另一種方法是讓服務器讀取這些CDN文件。如果它們很好，請打印鏈接的URL。但是，如果這些鏈接已經死亡，請改爲打印本地網址。這會更可靠，並將您的邏輯卸載到服務器。這假設你有權訪問服務器。

或更好的，首先使用本地版本！具有良好的緩存，帶寬將不會是一個問題

來源

2012-05-21 15:47:29 Joseph

HTML if語句在CDN失敗時加載本地JS/CSS

回答

相關問題