为什么 window.performance.timing.domContentLoadedEventStart 返回 0

Question

下面是我的js函数代码。

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

当我通过运行js file 运行上述代码时，window.performance.timing 返回一个object，其中domContentLoadedEventStart 具有一定的价值。但是当我尝试打印 window.performance.timing.domContentLoadedEventStart 时，它返回 0。

不确定发生了什么。谁能给我解释一下。

Answer 1

window.performance.timing

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

PerformanceTiming.domContentLoadedEventStart

PerformanceTiming.domContentLoadedEventStart 属性的值表示解析器发送 DOMContentLoaded 事件之前的时刻，以 UNIX 纪元以来的毫秒数为单位。

DOMContentLoaded事件

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

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="...">

.