布局偏移:sources 属性

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

sourcesLayoutShift 接口的只读属性,它返回一个 LayoutShiftAttribution 对象数组,这些对象指示在布局偏移期间移动的 DOM 元素。

ArrayLayoutShiftAttribution 对象。此数组最多包含五个源。如果布局偏移影响的元素超过五个,则报告五个影响最大的元素。

示例

记录布局偏移源

js
const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    entry.sources.forEach((source) => {
      console.log(source);
    });
  });
});

observer.observe({ type: "layout-shift", buffered: true });

规范

规范
布局不稳定性
# dom-layoutshift-sources

浏览器兼容性

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

另请参阅