如何在继续 Javascript 之前完全加载页面？

Question

抱歉，如果标题有点难以理解。请允许我详细说明。

在我的 Wordpress 网站上，我最近开始使用扩展 Custom Field Suite，以便能够创建自定义字段。它允许我之后在 html 中检索那些内容，这样如果我需要更改文本，我可以直接在 Wordpress 上进行，而不必拉出 html 文件和 re-upload他们每次。

今天我做了一些 Javascript，我需要检索来自这些自定义字段之一的文本。基本上检索这样的东西：

<h1 class="title"><?= CFS()->get('title'); ?></h1>

所以，我想做的是使用 QuerySelector 并将 class .title 检索到变量中，如下所示：

let sentence = document.querySelector(".title");

唯一的问题是 returns undefined，我想我知道为什么了。当我加载页面然后进入控制台并准确输入时，它起作用了，这让我相信我的 Javascript 检索标题的速度比 CFS()->get 返回的速度快。

我现在的问题是我不知道如何才能让我的标题及时加载，以便 Javascript 继续它，所以我想知道是否有人有想法。

提前致谢

Answer 1

可以使用Javascript的window.onload功能：

window.onload = function() {
    alert('Page is loaded');
};

或者您可以使用事件侦听器：

window.addEventListener("load", function() {
    alert('Page is loaded');
});

一定要把你的js放在函数里面。请注意，这是众多可能性中的一种，因此您一定可以研究更多选项。

How to load page completely before proceeding with Javascript?