`<script defer>` 是HTML中用于延迟JavaScript脚本执行的一个属性。它的主要作用是让脚本在HTML文档解析完成后，但在`window.onload`事件触发前执行。这种特性对于提升页面加载速度和用户体验有着显著的影响。
当`defer`属性被添加到`<script>`标签中，浏览器会按照脚本在文档中的出现顺序依次下载这些脚本，但不会立即执行。只有在整个HTML文档解析完成（即DOM树构建完成）后，才会按照顺序执行这些带有`defer`属性的脚本。这种方式避免了阻塞HTML渲染，使得页面可以更快地呈现给用户，同时确保脚本执行时DOM已经准备就绪。
举个例子，假设你有一个脚本用于操作页面上的元素，如按钮或图片。如果这个脚本在页面加载时执行，而此时元素尚未创建，脚本就无法找到相应的对象，导致错误。但如果加上`defer`属性，脚本将在DOM构建完成后再执行，此时所有元素都已经存在于页面中，脚本就可以正确地找到并操作它们。
在实际应用中，`defer`属性通常适用于那些不依赖其他脚本，且不影响页面初始渲染的脚本。例如，一个用于设置页面样式或实现某些交互功能的脚本，可以延迟到页面加载完成后执行。
然而，需要注意的是，`defer`属性并不适用于所有情况。以下是一些使用`defer`时的注意事项：
1. **不要在`defer`脚本中使用`document.write`**：因为`document.write`会在文档流中插入内容，而在`defer`脚本执行时，文档流已经关闭，这会导致错误。
2. **全局变量和函数的依赖**：如果`defer`脚本依赖于其他脚本中定义的全局变量或函数，要确保这些变量和函数在`defer`脚本执行前已经被定义。
3. **非同步脚本的执行顺序**：`defer`属性保证了脚本按其在HTML中的顺序执行，但不适用于异步加载的脚本（如`async`属性的脚本），异步脚本的执行顺序是不确定的。
4. **浏览器兼容性**：`defer`属性在大部分现代浏览器中都被支持，但在一些较旧的浏览器或非主流浏览器中可能不工作，因此在使用时需要考虑兼容性问题。
总结来说，`<script defer>` 是一种优化网页加载性能的技术，它允许脚本在不阻塞页面渲染的情况下延迟执行，确保脚本执行时DOM已经完整。合理利用`defer`属性，可以提高页面的加载速度，提升用户体验，同时保证脚本能够正确地运行。
