HTMLScriptElement: fetchPriority 屬性

Baseline 2024
新推出

自 2024 年 10 月以來,此功能已可在最新的裝置和瀏覽器版本上使用。此功能可能不適用於舊裝置或瀏覽器。

HTMLScriptElement 介面的 fetchPriority 屬性表示一個提示,用於指示瀏覽器如何相對於其他外部指令碼來優先獲取該外部指令碼。它反映了 <script> 元素的 fetchpriority 屬性。

該屬性允許開發者指示,在載入過程中早期或晚期獲取某個指令碼對使用者體驗的影響,比瀏覽器在分配內部優先順序時通常能夠推斷出的更為重要。這反過來又允許瀏覽器提高或降低優先順序,並可能比平時更早或更晚地載入指令碼。該屬性應謹慎使用,因為過度或不正確的優先順序設定會降低效能。

fetch 優先順序允許您降低晚期 body 指令碼的優先順序,或者在不使用 preloading 的情況下提高 async 指令碼的優先順序。當指令碼的早期載入很重要時,可以使用優先順序來補充 preloading,將優先順序提高到比預設優先順序更高的、影響較小的資源之上。

請注意,任何獲取操作的內部優先順序以及 fetchPriority 對優先順序的影響完全取決於瀏覽器。

一個表示優先順序提示的字串。可能的值為:

high

以高優先順序相對於其他外部指令碼獲取外部指令碼。

low

以低優先順序相對於其他外部指令碼獲取外部指令碼。

auto

不設定 fetch 優先順序的偏好。這是預設值。如果沒有設定值或設定了無效值,則使用此選項。

示例

html
<script id="el" type="module" src="main.js" fetchpriority="high"></script>
js
const el = document.getElementById("el");
console.log(el.fetchPriority); // Output: "high"

規範

規範
HTML
# dom-script-fetchpriority

瀏覽器相容性

另見