PerformanceResourceTiming: initiatorType 屬性

Baseline 已廣泛支援

此功能已成熟，可跨多種裝置和瀏覽器版本使用。自 2017 年 9 月以來，它已在瀏覽器中提供。

注意：此功能在 Web Workers 中可用。

initiatorType 只讀屬性是一個字串，表示啟動資源載入的 Web 平臺功能。

注意：此屬性不代表獲取內容的型別。可以使用 <link> 元素獲取 .css 檔案，這將導致 initiatorType 為 link。當使用 CSS 檔案中的 background: url() 載入圖片時，initiatorType 將是 css 而不是 img。

值

initiatorType 屬性可以具有以下值，如果沒有條件匹配，則為 other。

audio: 如果請求是由 <audio> 元素的 src 屬性發起的。
beacon: 如果請求是由 navigator.sendBeacon() 方法發起的。
body: 如果請求是由 <body> 元素的 background 屬性發起的。
css: 如果請求是由 CSS url() 函式發起的。
early-hint: 如果請求是由 103 Early Hint 響應發起的。
嵌入: 如果請求是由 <embed> 元素的 src 屬性發起的。
fetch: 如果請求是由 fetch() 方法發起的。
frame: 如果請求是由載入 <frame> 元素髮起的。
iframe: 如果請求是由 <iframe> 元素的 src 屬性發起的。
icon 不標準: 如果請求是由收藏夾圖示（favicon）發起的。不標準，並且僅由 Safari 報告。
圖片: 如果請求是由 <image> 元素髮起的。
img: 如果請求是由 <img> 元素的 src 或 srcset 屬性發起的。
input: 如果請求是由型別為 image 的 <input> 元素髮起的。
link: 如果請求是由 <link> 元素髮起的。
navigation: 如果請求是由導航請求發起的。
object: 如果請求是由 <object> 元素髮起的。
ping: 如果請求是由 <a> 元素的 ping 發起的。
script: 如果請求是由 <script> 元素髮起的。
track: 如果請求是由 <track> 元素的 src 發起的。
video: 如果請求是由 <video> 元素的 poster 或 src 發起的。
xmlhttprequest: 如果請求是由 XMLHttpRequest 發起的。

示例

過濾資源

initiatorType 屬性可用於僅獲取特定的資源計時條目。例如，僅獲取那些由 <script> 元素髮起的。

使用 PerformanceObserver 的示例，它會在瀏覽器效能時間線中記錄新的 resource 效能條目時通知。使用 buffered 選項可以訪問觀察者建立之前的條目。

const observer = new PerformanceObserver((list) => {
  const scripts = list
    .getEntries()
    .filter((entry) => entry.initiatorType === "script");
  console.log(scripts);
});

observer.observe({ type: "resource", buffered: true });

使用 Performance.getEntriesByType() 的示例，它只顯示在呼叫此方法時瀏覽器效能時間線中存在的 resource 效能條目

const scripts = performance
  .getEntriesByType("resource")
  .filter((entry) => entry.initiatorType === "script");
console.log(scripts);

規範

規範
資源時序 # dom-performanceresourcetiming-initiatortype

瀏覽器相容性

幫助改進 MDN

瞭解如何貢獻

此頁面最後修改於 ⁨2025 年 5 月 23 日⁩，由 MDN 貢獻者修改。

在 GitHub 上檢視此頁面 • 報告此內容的問題