首頁 >web前端 >css教學 >如何使用 JavaScript 正確刪除或替換樣式表?

如何使用 JavaScript 正確刪除或替換樣式表?

Barbara Streisand
Barbara Streisand原創
2024-12-13 15:02:10950瀏覽

How to Properly Remove or Replace a Stylesheet with JavaScript?

使用JavaScript/jQuery 刪除或取代樣式表()

嘗試從網頁中刪除樣式表動態地,您嘗試使用以下jQuery 程式碼:

$('link[title="mystyle"]').remove();

雖然此程式碼從DOM中刪除連結元素,樣式表中定義的樣式仍然會套用到頁面。 Opera 和 Firefox 中都會出現此行為。

要使用 JavaScript 成功刪除或取代樣式表,您需要了解瀏覽器的 CSS 檔案快取機制。瀏覽器將 CSS 樣式快取在記憶體中,這意味著即使從 DOM 中刪除樣式表元素後,樣式仍然可以套用。

要解決此問題:

對於跨瀏覽器相容性,停用樣式表而不是刪除它:

document.styleSheets[0].disabled = true;

使用jQuery:

$('link[title=mystyle]')[0].disabled=true;

透過停用樣式表,它被標記為非活動狀態,並且瀏覽器停止套用該樣式表中定義的樣式。這種方法在包括 Internet Explorer 在內的主要瀏覽器中一致有效。

以上是如何使用 JavaScript 正確刪除或替換樣式表?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn