jQuery 如何在沒有靜態 CSS 檔案的情況下動態產生和套用 CSS 規則？

使用 jQuery 產生動態 CSS 規則

問題：

CSS 檔案通常需要 CSS 規則的靜態定義。如何在不使用靜態 CSS 檔案的情況下在運行時動態建立可重複使用的 CSS 規則？

解決方案：

使用 jQuery，我們可以附加一個

$("<style type="text/css"> .redbold{ color:#f00; font-weight:bold;} </style>").appendTo("head");

範例：

要建立靜態CSS 規則#my-window，我們將新增跟隨HTML 的head 元素文件：

$("<style type="text/css"> #my-window { position:fixed; z-index:102; display:none; top:50%; left:50%; } </style>").appendTo("head");

用法：

以此方式定義CSS 規則後，可以使用 addClass() 方法將其應用於 DOM 元素：

$("element-to-style").addClass("my-window");

此方法可以輕鬆建立和應用可重複使用的 CSS 規則，而無需單獨的 CSS檔案。

以上是jQuery 如何在沒有靜態 CSS 檔案的情況下動態產生和套用 CSS 規則？的詳細內容。更多資訊請關注PHP中文網其他相關文章！