需要在页面加载后触发一个函数（它在 jquery 中工作，但不是纯 javascript）

Question

以下问题困扰了我很多时间。我需要一些意见。

我安装了一个加载 jquery 脚本的 wordpress 插件。 我有自己的纯 javascript（不是 jquery）函数，该函数需要在页面加载完成后运行（并且它必须在插件的 jquery 脚本之后运行）。

我在页面完成加载后使用它来触发我的功能（并且工作正常），但是在我更新主题中的内容后，它就停止工作了：

window.addEventListener('load', myFunction);

出于测试目的：

• 我在我的函数中添加了一个警告框，该框必须在页面加载完成后运行，以便查看函数何时被触发。在页面加载完成之前，alterbox 就出现了。
• 我玩弄了 wordpress JS 依赖项，但没有运气。

作为最后的手段，我决定尝试使用 jquery 触发我的纯 Javascript 函数（我知道这很奇怪）。我使用了以下方法，突然之间它起作用了：

jQuery(document).ready(function($) {
    myFunction();
});

我觉得用Jquery来触发一个纯Javascript的函数有点奇怪。但这是我能让事情顺利进行的唯一方法。

所以我的问题是......

为什么会这样：

jQuery(document).ready(function($) {
        myFunction();
    });

但是，不是这个（即使我的函数是纯 javascript）：

window.addEventListener('load', myFunction);

我没有使用正确的 EventListener，还是有什么问题？

Answer 1

$(document).ready() 的纯 JS 等价物是为DOMContentLoaded 设置一个事件监听器：

那就是：

document.addEventListener("DOMContentLoaded", myFunction)