当设置 defer 属性为 true 时,脚本将在文档解析完成后按照它们在文档中出现的顺序执行。这有助于避免脚本阻塞页面渲染,提高页面加载性能。
以下是一个使用 defer 属性的示例:
<!DOCTYPE html>
<html>
<head>
<title>Script defer Attribute Example</title>
<!-- 外部脚本文件的链接,使用 defer 属性 -->
<script src="deferred-script.js" defer></script>
</head>
<body>
<h1>Hello from HTML!</h1>
<script>
// 这是一个内联脚本
console.log("This is an inline script.");
</script>
</body>
</html>
在这个例子中,我们在 <head> 部分使用了一个 <script> 元素,并通过 src 属性将外部脚本文件 "deferred-script.js" 链接到文档中,并设置了 defer 属性。同时,在文档的 <body> 部分,我们还包含了一个内联脚本。
外部脚本文件 "deferred-script.js" 中的代码将在文档解析完成后执行,而内联脚本的代码也将执行,但执行顺序取决于浏览器的加载和执行策略。
需要注意的是,defer 属性仅对外部脚本有效,而内联脚本始终在解析时执行。
转载请注明出处:http://www.zyzy.cn/article/detail/4504/HTML