scripting.insertCSS()
將 CSS 注入頁面。
注意：此方法在 Chrome 的 Manifest V3 或更高版本以及 Firefox 101 中可用。在 Safari 和 Firefox 102+ 中，此方法在 Manifest V2 中也可用。
要使用此 API，您必須擁有 "scripting" 許可權以及目標 URL 的許可權，該許可權可以顯式地作為 主機許可權，也可以使用 activeTab 許可權。
您只能將 CSS 注入到 URL 可以使用 匹配模式表示的頁面中：這意味著其 scheme 必須是 "http"、"https" 或 "file" 之一。這意味著您不能將 CSS 注入到任何瀏覽器的內建頁面中，例如 about:debugging、about:addons，或者開啟新空標籤頁時顯示的頁面。
注意： Firefox 會相對於注入的 CSS 檔案解析 CSS 檔案中的 URL，而不是相對於注入它的頁面。
可以透過呼叫 scripting.removeCSS() 來移除插入的 CSS。
這是一個非同步函式，返回一個 Promise。
語法
await browser.scripting.insertCSS(
details // object
)
引數
details-
一個描述要插入的 CSS 及其插入位置的物件。它包含以下屬性：
css可選-
string。一個包含要注入的 CSS 的字串。必須指定css或files其中之一。 files可選-
arrayofstring。要注入的 CSS 檔案的路徑，相對於擴充套件的根目錄。必須指定files或css其中之一。 origin可選-
string。注入的樣式來源，可以是USER，用於將 CSS 新增為使用者樣式表，或AUTHOR，用於將其新增為作者樣式表。預設為AUTHOR。從 Firefox 144 開始，此屬性不區分大小寫。USER使您能夠阻止網站覆蓋您插入的 CSS：請參閱 層疊順序。AUTHOR樣式表表現得好像它們出現在網頁指定的任何作者規則之後。此行為包括頁面指令碼動態新增的任何作者樣式表，即使該添加發生在insertCSS呼叫完成之後。
目標-
scripting.InjectionTarget。指定要將 CSS 注入目標（的詳細資訊）。
返回值
一個 Promise，當所有 CSS 都已插入時，它將以無引數的方式解析。如果發生任何錯誤，Promise 將被拒絕。
示例
此示例將從字串中獲取的 CSS 注入到活動標籤頁中。
browser.action.onClicked.addListener(async (tab) => {
try {
await browser.scripting.insertCSS({
target: {
tabId: tab.id,
},
css: `body { border: 20px dotted pink; }`,
});
} catch (err) {
console.error(`failed to insert CSS: ${err}`);
}
});
此示例注入從檔案中載入的 CSS（與擴充套件打包在一起），該檔名為 "content-style.css"。
browser.action.onClicked.addListener(async (tab) => {
try {
await browser.scripting.insertCSS({
target: {
tabId: tab.id,
},
files: ["content-style.css"],
});
} catch (err) {
console.error(`failed to insert CSS: ${err}`);
}
});
瀏覽器相容性
載入中…
注意： 此 API 基於 Chromium 的 chrome.scripting API。