Vanilla JS 应用程序中仍然需要 $document.ready() 的现代等效项吗？

Question

当我几年前学习 JavaScript 时，jQuery 仍然被认为是良好的标准实践，并且建议从$document.ready()事件处理程序中调用主应用程序代码，以确保 DOM 可以安全使用。

距离我上次使用 JavaScript 已经过去了几年，现在的共识似乎是避免使用 jQuery。另外，由于脚本通常在 HTML 文档的最后加载，因此看起来$document.ready()可能不再需要了。

有问题的$(document).ready 相当于没有 jQuery，我看到了这段代码的几个现代替代方案。然而，我仍然不清楚包括其中任何一项是否被视为标准做法或一般建议。

所以我的问题是关于当前的实践：我是否应该始终包含这样的代码作为 Vanilla JS 应用程序的入口点，或者相反，现在开始加载没有任何包装器的 JS 应用程序是否被认为是安全的？

Answer 1

等价的是DOMContentLoaded事件

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

来源：https ://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event

window.addEventListener('DOMContentLoaded', (event) => {
    console.log('DOM fully loaded and parsed');
});

为了解决你问题的最后一部分，我会说“是的！” ^^

您可以在此“主函数”范围之外定义自定义函数，但要等待事件完成后再对 DOM 执行任何操作。