PerformanceElementTiming: naturalHeight 属性

实验性: 这是一个 实验性技术
在生产环境中使用此功能之前,请仔细查看 浏览器兼容性表格

naturalHeightPerformanceElementTiming 接口的只读属性,它返回图像元素的固有高度。

一个无符号 32 位整数(无符号长整型),如果应用于图像,则为图像的固有高度,对于文本则为 0

示例

记录 naturalHeight

在此示例中,一个 <img> 元素通过添加 elementtiming 属性来进行观察。注册了一个 PerformanceObserver 来获取所有类型为 "element" 的性能条目,并且使用 buffered 标志来访问观察器创建之前的數據。图像文件宽度为 1000px,高度为 750px。调用 entry.naturalHeight 返回 750,即以像素为单位的固有高度。

html
<img
  src="image.jpg"
  alt="a nice image"
  elementtiming="big-image"
  id="myImage" />
js
const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    if (entry.identifier === "big-image") {
      console.log(entry.naturalHeight);
    }
  });
});
observer.observe({ type: "element", buffered: true });

规范

规范
元素计时 API
# ref-for-dom-performanceelementtiming-naturalheight

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。