如何在 Google Optimize 中的 Document Ready 上运行 Javascript？答案

【问题标题】：How do I run Javascript on Document Ready in Google Optimize?如何在 Google Optimize 中的 Document Ready 上运行 Javascript？
【发布时间】：2017-09-13 07:18:46
【问题描述】：

如何在 Google 优化广告系列中的窗口加载或文档就绪时运行 javascript？似乎它允许我一直选择 DOM 元素直到 Body，但我需要在准备好的文档上运行 js。

【问题讨论】：

标签： google-optimize

【解决方案1】：

这就是我的做法：

在可视化编辑器中编辑您的实验变体。
点击选择元素图标（左上角的矩形）
在元素选择器字段中，输入body。
单击添加更改按钮并选择Javascript。这将打开一个对话框，允许您输入一个将为主体调用的 JS 函数。
在其中输入您要运行的代码，并确保选择了在结束标记之后选项。

由于 Google Optimize 的特性，我希望在加载 DOM 元素之前它不会开始搞乱它们。并且因为您在 body 标记上选择了 After close tag 选项，这应该确保所有元素都已加载到 DOM 中。

但是，如果您想 100% 确定，您可以编写这样的函数。

function runOnLoad() {
    console.log('this will only run when window is loaded');
}
if(document.readyState === "complete") {
    runOnLoad();
} else {
    window.addEventListener("onload", runOnLoad, false);
}

该代码 sn-p 改编自 How to check if DOM is ready without a framework?

【讨论】：

“在元素选择器字段中，输入正文。”不允许我选择 body 元素。
@FullDecent 我刚才又试了一次，它似乎仍然对我有用。您不能使用点击式 GUI 来选择主体。您需要单击方形图标并手动输入“body”一词。或者，您可以尝试选择不同的元素并将 JS 应用于该元素。理论上应该可以，但是我没试过。
好的，更正。我可以输入body 并查看“元素：1”。但我无法点击添加更改，因为在实验运行期间不能添加更改的记录不充分。

【解决方案2】：

如果上面的代码不起作用。

尝试使用：

document.onreadystatechange = function() {
    if(document .readyState === "complete") {
      console.log('this will only run when window is loaded');
    }
}

参考：https://developer.mozilla.org/en-US/docs/Web/API/Document/readyState

【讨论】：