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 上查看此页面 • 报告此内容的问题