Javascript 为什么；加载事件在addEventListener（）上不起作用；？

我试图在页面的body元素加载后记录一些内容，但日志没有出现在控制台中。我做错了什么

const body=document.querySelector（'body'）；
函数setInitialGradient（）{
log（'无法在控制台上看到此消息'）；
body.style.background=`线性渐变（向右，${color1.value}，${color2.value}）`；
cssProperty.textContent=body.style.background+'；'；
}
body.addEventListener（'load'，setInitialGradient）

加载

事件是

窗口

的属性，既不是

文档

也不是

正文

。您需要改用Windows：

window.addEventListener('load', setInitialGradient);

若要在加载正文或任何特定html元素时使用函数，则需要使用：

body.onload = setInitialGradient;
// I would use document.onload BTW if it is for body rather than other element

---

window.addEventListener（'DOMContentLoaded'，function（）{/*将代码放在这里*/}）
改用DOMContentLoaded
该事件将提前触发，通常被认为是更好的选择

[加载事件]应仅用于检测完全加载的页面。在DOMContentLoaded更合适的地方使用load是一个常见的错误

在文档对象上设置它

document.addEventListener('DOMContentLoaded', setInitialGradient);

如果必须使用加载事件
如果必须使用该事件，则可以将侦听器添加到
窗口
：

window.addEventListener('load', setInitialGradient);

但请注意：

加载整个页面（包括样式表和图像等所有相关资源）时，将触发加载事件。这与DOMContentLoaded形成对比，DOMContentLoaded在页面DOM加载后立即启动，而不等待资源完成加载

虽然这段代码片段可以解决提出的问题，但我们希望答案中包含解释。行动中遗漏了什么？这个代码是如何处理的？@JoshuaDrake谢谢你的留言，但我认为问题是直截了当的。