21

我需要在收到页面内容（整个 HTML 元素）后立即触发脚本，但还不必渲染它。

我认为只有一个简单的<script>标签在我的页面顶部执行一些代码就可以了？

换个方式来表述这个问题：DOM 就绪是否意味着所有元素和资源都已被拉取和渲染？

4

5 回答 5

41

DOM 就绪意味着所有 HTML 都已被浏览器接收并解析到现在可以操作的 DOM 树中。

它发生在页面完全呈现之前（因为外部资源可能尚未完全下载 - 包括图像、CSS、JavaScript 和任何其他链接资源）。

实际事件称为window.DOMContentLoaded。

于 2012-09-28T09:57:07.197 回答
7

DOMready 表示：DOM 结构已经构建在浏览器内存中。异步页面已经开始渲染，但它可能还没有完成，因为图像、视频等外部资源将在稍后完成加载。

于 2012-09-28T09:58:32.040 回答
5

您也可以尝试使用这些功能

window.onload = function(){
   //your code
  }

或者

body.onload = function(){
   //your code
  }

如果你不想使用 jQuery。

但要小心，DOM 加载并不意味着页面加载，iframe、javascript、图像和 css 可能会在该事件之后加载。

关于 DOM 事件Javascript 教程有一个很好的教程

于 2012-09-28T10:03:04.800 回答
5

我需要在收到页面内容（整个 HTML 元素）后立即触发脚本，但还不必渲染它。

我认为只有一个简单的标签在我的页面顶部执行一些代码就可以了？

那么你很可能想要这个DOMContentLoaded事件。您可以这样使用它：

    <head>
    <!-- … --->
        <script>
window.addEventListener('DOMContentLoaded',function () {
    //your code here
});
        </script>
    </head>

换一种方式来表述问题：DOM 就绪是否意味着所有元素和资源都已被拉取和渲染？

没有“ DOM 就绪”事件。您可能会想到jQuery.ready()或该术语的一些类似的奇怪用法（例如，Google 也有一个类似名称的专有事件，它们指代）。

但是，对于该DOMContentLoaded事件（引用MDN）：

DOMContentLoaded 事件在初始 HTML 文档完全加载和解析后触发，无需等待样式表、图像和子框架完成加载。

于 2019-09-05T16:12:51.823 回答
-1

文档对象模型 (DOM) 是一种跨平台且与语言无关的约定，用于表示 HTML、XHTML 和 XML 文档中的对象并与之交互。 [1] 每个文档的节点都组织在一个树结构中，称为 DOM 树

于 2014-09-27T09:48:19.533 回答