js延迟加载的方式有哪些?

延迟加载（Deferred Loading）是一种优化网页性能的技术，可以延迟加载页面中的资源（如脚本、样式表、图片等），从而加快页面的初始加载速度。

以下是几种常见的 JavaScript 延迟加载的方式：

1. defer 属性：将脚本标签的 defer 属性设置为 "defer"，使得脚本在页面完成解析时执行。例如：<script src="script.js" defer></script>

2. 动态创建 script DOM：通过 JavaScript 动态创建 <script> 元素，并将其插入到页面中。这样可以控制脚本的加载时机，例如在页面加载完毕后再加载脚本

var script = document.createElement('script');
script.src = 'script.js';
document.body.appendChild(script);

3. XmlHttpRequest 脚本注入：使用 XMLHttpRequest 对象加载 JavaScript 脚本，并将其注入到页面中。这种方式可以在页面加载过程中异步加载脚本。示例代码如下：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'script.js', true);
xhr.onload = function() {
  if (xhr.status === 200) {
    var script = document.createElement('script');
    script.textContent = xhr.responseText;
    document.body.appendChild(script);
  }
};
xhr.send();

4. 延迟加载工具：使用第三方的延迟加载工具库，如 LazyLoad，可以更方便地管理和控制页面中的延迟加载资源。这些工具通常提供了更多的功能和配置选项，例如按需加载、懒加载、预加载等。

这些延迟加载的方式可以根据具体的需求和场景选择合适的方式来优化页面加载性能，提升用户体验。