為什麼 IE 中動態 CSS 載入失敗，如何修復？

IE動態CSS載入失敗的解決方案

為了追求增強網頁美觀度，往往需要動態載入CSS樣式表。雖然這種技術可以在 Firefox 和 Google Chrome 等流行瀏覽器中無縫運行，但在 Internet Explorer (IE) 中卻遇到了障礙。

使用jQuery，實現動態CSS 載入的常見方法是：

var head = document.getElementsByTagName('head')[0];
$(document.createElement('link'))
    .attr({ type: 'text/css', href: '../../mz/mz.css', rel: 'stylesheet' })
    .appendTo(head);

但是，IE 提出了一個獨特的挑戰，因為此方法在此瀏覽器中無法產生所需的結果。

要克服這個問題障礙，有必要採用特定於瀏覽器的方法。當 IE 遇到頁面載入的所有樣式都已處理完畢的情況時，新增額外樣式表的唯一可靠解決方案是利用 document.createStyleSheet(url) 方法。

有效的跨瀏覽器實作可以是透過使用以下程式碼來實現：

url = 'style.css';
if (document.createStyleSheet) {
    document.createStyleSheet(url);
} else {
    $('<link rel="stylesheet" type="text/css" href="' + url + '" />').appendTo('head');
}

透過document.createStyleSheet 方法適應IE 的獨特行為，可以動態地在所有主要瀏覽器中載入CSS 樣式表，確保在各個平台上實現一致的視覺增強。

以上是為什麼 IE 中動態 CSS 載入失敗，如何修復？的詳細內容。更多資訊請關注PHP中文網其他相關文章！