为什么 window.performance.timing.domContentLoadedEventStart return 0

Question

下面是我的js函数代码。

console.log(window.performance.timing);
console.log(window.performance.timing.domContentLoadedEventStart);

当我 运行 上面的代码由 运行 宁我的 js file, window.performance.timing returns 一个 object 其中 domContentLoadedEventStart 有一定的价值。但是当我试图打印 window.performance.timing.domContentLoadedEventStart 它时 returns 0.

不确定发生了什么。有人可以解释一下吗？

Answer 1

window.performance.timing

此 属性 有一个 PerformanceTiming 对象描述您的页面。

PerformanceTiming.domContentLoadedEventStart

PerformanceTiming.domContentLoadedEventStart 属性 有一个值表示解析器发送 DOMContentLoaded 事件 之前 的时刻，自 UNIX 以来以毫秒为单位时代。

DOMContentLoaded 事件

DOMContentLoaded 事件在初始 HTML 文档完全加载和解析时触发，无需等待样式表、图像和子框架完成加载。

之所以window.performance.timing.domContentLoadedEventStart给了你0

您的脚本是在 DOMContentLoaded 事件发生之前执行的，因此在解析器发送 DOMContentLoaded 事件之前的那一刻，当时是未知的。

防止它

为了防止PerformanceTiming.domContentLoadedEventStart变成0，你必须在DOMContentLoaded事件发生后引用它。试试这个：

document.addEventListener("DOMContentLoaded", event => {
    console.info("DOM fully loaded and parsed.");
    console.info(window.performance.timing.domContentLoadedEventStart);
});

或

<script defer src="...">

.