content_scripts
| 型別 | Array |
|---|---|
| 必填 | 否 |
| Manifest 版本 | 2 或更高 |
| 示例 |
json |
指示瀏覽器將 內容指令碼 載入到 URL 與指定模式匹配的網頁中。
此鍵是一個數組。每個專案都是一個物件,該物件
- 必須 包含一個名為
matches的屬性,該屬性指定要載入指令碼的 URL 模式; - 可以 包含名為
js和css的屬性,這些屬性列出了要載入到匹配頁面中的指令碼和樣式表;並且 - 可以 包含一些其他屬性,用於控制內容指令碼的載入方式和時機。
此表詳細介紹了您可以包含的所有屬性。
| 名稱 | 型別 | 描述 |
|---|---|---|
all_frames
|
Boolean |
預設為 |
css
|
Array |
一個相對於 注意: Firefox 會相對於 CSS 檔案本身解析注入的 CSS 檔案中的 URL,而不是相對於其注入到的頁面。 |
css_origin
可選 |
String |
CSS 注入的樣式來源
"author"。此屬性在 Firefox 和 Safari 中對大小寫不敏感。 |
exclude_globs
|
Array |
一個包含萬用字元的字串陣列。請參閱下面的 匹配 URL 模式。 |
exclude_matches
|
Array |
一個 匹配模式 陣列。請參閱下面的 匹配 URL 模式。 |
include_globs
|
Array |
一個包含萬用字元的字串陣列。請參閱下面的 匹配 URL 模式。 |
js
|
Array |
一個相對於 |
match_about_blank
|
Boolean |
將內容指令碼插入到 URL 為 這對於在 URL 為 例如,假設您有如下 json 如果使用者載入
注意: 從 Firefox 52 版本開始支援 請注意,在 Firefox 中,即使您在 |
match_origin_as_fallback
|
Boolean |
如果為 true,則在 about:、data: 和 blob: 頁面的來源與 matches 中的模式匹配時,即使文件來源不透明(由於使用了 CSP 或 iframe 沙箱),程式碼也會被注入。matches 中的匹配模式必須指定一個萬用字元路徑 glob。預設為 false。 |
matches
|
Array |
這是唯一必需的鍵。 |
run_at
|
String |
此選項確定
預設值為 |
world
|
String |
指令碼執行的 JavaScript 世界。
預設值為 |
載入順序
content_scripts 中的已註冊物件會在 run_at 指定的時間(先 document_start,然後 document_end,最後 document_idle)注入到匹配的網頁中。
- 按照
content_scripts陣列中指定的順序,對於具有匹配的run_at值的每個物件,然後:- CSS 按其
css陣列中指定的順序應用。預設情況下,"author"來源的 CSS 具有優先權,除非css_origin設定為"user"。 - JavaScript 程式碼按其
js陣列中指定的順序執行。
- CSS 按其
例如,在此鍵規範中:
"content_scripts": [
{
"matches": ["*://*.mozilla.org/*"],
"js": ["jquery.js", "my-content-script.js"],
"run_at": "document_idle"
},
{
"matches": ["*://*.mozilla.org/*"],
"css": ["my-css.css"],
"js": ["another-content-script.js", "yet-another-content-script.js"],
"run_at": "document_idle"
},
{
"matches": ["*://*.mozilla.org/*"],
"js": ["run-first.js"],
"run_at": "document_start"
}
]
當開啟 mozilla.org 域時,檔案按以下方式載入:
"run-first.js"- 因為它被請求在"document_start"執行。"jquery.js"- 因為它在第一個請求在"document_idle"執行的陣列中。"my-content-script.js"- 因為它是第一個請求在"document_idle"執行的陣列中的第二個專案。"my-css.css"- 因為物件的 CSS 在其 JavaScript 之前載入。"another-content-script.js"- 因為它是js屬性中的第一個專案。"yet-another-content-script.js"
匹配 URL 模式
"content_scripts" 鍵根據 URL 匹配將內容指令碼附加到文件:如果文件的 URL 與鍵中的規範匹配,則將附加該指令碼。"content_scripts" 中有四個屬性可用於此規範:
matches-
一個 匹配模式 陣列
exclude_matches-
一個 匹配模式 陣列
include_globs-
一個 glob 陣列
exclude_globs-
一個 glob 陣列
要匹配這些屬性之一,URL 必須至少匹配其陣列中的一個專案。例如,給定一個屬性:
"matches": ["*://*.example.org/*", "*://*.example.com/*"]
http://example.org/ 和 http://example.com/ 都將匹配。
由於 matches 是唯一必需的鍵,因此其他三個鍵用於進一步限制匹配的 URL。要使整個鍵匹配,URL 必須:
- 匹配
matches屬性 - 並且匹配
include_globs屬性(如果存在) - 並且不匹配
exclude_matches屬性(如果存在) - 並且不匹配
exclude_globs屬性(如果存在)
globs
Glob 只是一個可能包含萬用字元的字串。
有兩種萬用字元,您可以在同一個 glob 中組合它們:
*匹配零個或多個字元?匹配正好一個字元。
例如:"*na?i" 將匹配 "illuminati" 和 "annunaki",但不匹配 "sagnarelli"。
示例
"content_scripts": [
{
"matches": ["*://*.mozilla.org/*"],
"js": ["borderify.js"]
}
]
這會將單個內容指令碼 borderify.js 注入到 mozilla.org 或其任何子域下的所有頁面中,無論它們是透過 HTTP 還是 HTTPS 提供。
"content_scripts": [
{
"exclude_matches": ["*://mdn.club.tw/*"],
"matches": ["*://*.mozilla.org/*"],
"js": ["jquery.js", "borderify.js"]
}
]
這會將兩個內容指令碼注入到 mozilla.org 或其任何子域下的所有頁面中,但 developer.mozilla.org 除外,無論它們是透過 HTTP 還是 HTTPS 提供。
內容指令碼看到 DOM 的檢視相同,並且按照它們在陣列中出現的順序注入,因此 borderify.js 可以看到由 jquery.js 新增的全域性變數。
瀏覽器相容性
載入中…