CSSStyleSheet: replace() 方法

語法

replace(text)

引數

文字

包含用於替換樣式表內容的樣式規則的字串。如果字串不包含可解析的規則列表，則其值將被設定為空字串。

注意： 如果 text 中傳入的任何規則是使用 @import 規則匯入的外部樣式表，這些規則將被移除，並在控制檯中列印一條警告。

返回值

一個 Promise，它會解析為 CSSStyleSheet 物件。

異常

NotAllowedError DOMException

在滿足以下兩種條件之一時丟擲

• 樣式表不是使用 CSSStyleSheet() 建構函式建立的。
• 樣式表被標記為不可修改。

示例

在下面的示例中，建立了一個新的樣式表，並使用 replace() 添加了兩條 CSS 規則。然後，第一條規則被列印到控制檯，輸出結果為：body { font-size: 1.4em; }

const stylesheet = new CSSStyleSheet();

stylesheet
  .replace("body { font-size: 1.4em; } p { color: red; }")
  .then(() => {
    console.log(stylesheet.cssRules[0].cssText);
  })
  .catch((err) => {
    console.error("Failed to replace styles:", err);
  });

規範

瀏覽器相容性

另見

• 可構造樣式表 (web.dev)
• 使用 Shadow DOM