将 onDomContentLoaded 函数调用附加到 HTML 文件中的 DOM 对象

Posted 2023-03-28

【中文标题】将 onDomContentLoaded 函数调用附加到 HTML 文件中的 DOM 对象

【英文标题】：Attach onDomContentLoaded function call to DOM object in HTML file

【发布时间】：2020-10-17 12:56:16

【问题描述】：

<div id = "myGrid" onDomContentLoaded = "console.log('this')"></div>

有没有办法附加这样的 javascript 逻辑，在所有延迟脚本运行后运行，并将 dom 元素维护为“this”？

【问题讨论】：

DOMContentLoaded 在document 上触发。它不适用于文档的子级。 developer.mozilla.org/en-US/docs/Web/API/Window/…

孩子们有什么可用的吗？

另外，如果您想等到所有延迟脚本完成，您应该使用load 事件。 DOMContentLoaded 只表示文档已经被解析到 dom 中。

为什么事件处理程序必须在孩子身上？处理文档上的事件，然后运行将输出放入子级的回调对您不起作用？

我可以改为使用一个事件，在加载所有 myGrid 对象后向 dom 询问它们，我只是认为不必这样做会很好。因为将来我可能会有很多不同类型的对象，有些在一个页面中存在不止一次，而且在 html 标签内调用构造函数似乎更容易。

【参考方案1】：

我觉得你可以这样写：

window.addEventListener('DOMContentLoaded', (event) => 
    console.log(this);
);

【讨论】：

我正在寻找一种将“this”绑定到容纳我的网格的 HTML DOM 元素的方法。在您的情况下，我会将其绑定到窗口对象。