如何定义页面解析完成后执行脚本?
在本文中,我们将了解如何在页面解析完成后执行脚本。
当您使用标记包含任何外部脚本时,您可以选择在 HTML 页面完成加载后加载和执行脚本,为此您可以使用defer 关键字作为脚本标签中的属性。当您包含任何可能会阻止页面 UI 呈现的巨大外部脚本时,这很有用,通过使用脚本标记中的 defer 属性,您可以首先加载 HTML,并且当 UI 呈现完成时,巨大的脚本将开始执行.
defer是一个布尔属性。它异步加载脚本并在加载 HTML 后执行它。 defer 关键字只能与外部脚本一起使用,这意味着src属性应该存在。它在 DOM 内容准备好但在DOMContentLoaded触发之前加载脚本。
使用 defer 关键字包含的脚本称为延迟脚本。
句法:
例子:
在此示例中,我们包含了一个繁重的脚本(jQuery 脚本)并展示了两个输出的不同之处。在这里,您可以看到在第一个输出中我们没有使用 defer 关键字,而在第二个输出中,我们使用了 defer 关键字。
HTML
Content before script
Content after script
输出:
- 无延迟输出(第二个
在脚本完全加载后加载)
- 延迟输出(在完全加载 DOM 内容后加载脚本)