js等待加载完后执行

发布于 2023-11-20 16:14:45 浏览 127 次

前述

详情

问题解析：

【】

1、在 JavaScript 中，你可以使用多种方式来等待页面加载完毕后再执行相应的操作。以下是几种常见的方法： 2、 1、window.onload 事件：

window.onload = function() {
    // 在页面完全加载后执行的操作
};

3、使用 window.onload 事件可以确保整个页面及其所有资源都已经加载完成后再执行相应的操作。 4、 2、DOMContentLoaded 事件：

document.addEventListener('DOMContentLoaded', function() {
    // 在 DOM 结构加载完成后执行的操作
});

5、 DOMContentLoaded 事件会在 DOM 结构加载完成后触发，此时页面的样式表、图片等外部资源可能还未加载完毕。 6、 3、jQuery 的 $(document).ready() 方法： 7、如果你在项目中使用了 jQuery，你也可以使用它提供的 ready() 方法：

$(document).ready(function() {
    // 在 DOM 结构加载完成后执行的操作
});

8、这种方式与 DOMContentLoaded 事件类似，会在 DOM 结构加载完成后执行相应的操作。 9、 4、async/defer 属性： 10、在引入外部 JavaScript 文件时，你可以使用 async 或 defer 属性来控制脚本的加载和执行时机。 11、（1）使用 async 属性： 12、 <script src="example.js" async></script> 13、脚本会异步加载，加载完成后会立即执行。 14、（2）使用 defer 属性： 15、 <script src="example.js" defer></script> 16、脚本会异步加载，但会等到整个文档解析完成后才执行。