有一种方法可以在页面上存在元素时将事件处理程序附加到HTML元素。

Question

我不想等到整个HTML DOM准备就绪。请注意，我不是在谈论动态加载的HTML元素。我说的是HTML中但尚未渲染的元素。

Answer 1

三个想法：

1. 在HTML中使用onclick="foo()"中的属性。这将立即生效。

2. 您可以在HTML中嵌入HTML元素后立即放置<script>标记，并让该脚本添加事件处理程序。保证脚本之前的所有DOM元素都被解析并准备就绪。

3. 您可以通过最初隐藏（内联样式规范或CSS）来创建元素，然后等到它在DOM中，运行脚本以安装事件处理程序，然后使对象可见。如果您使用visibility: hidden，则文档将正常布局，并且可以在安装事件处理程序后生成visibility: visible内容。

在解析对象之前，浏览器不提供对象的访问权限，因此任何想要对其进行操作的脚本都必须物理上位于DOM元素之后，或者必须等待事件发生，这表明DOM已加载。

当解析DOM元素时，浏览器不会提供事件，但是当前不可见，这会让您有机会对其进行操作，因此您必须使用其中一种方法解决您的问题。

Answer 2

你必须等到渲染document.body。

之后可以像这样做任何事情

var ele = document.createElement("div");
ele.onclick = function(e){...};
document.body.appendChild(ele);