除了onload事件,还有以下几种方式可以在网页加载时执行代码:

  1. DOMContentLoaded事件:该事件在DOM解析完成后触发,不需要等待所有资源加载完成。可以使用以下代码监听该事件:
document.addEventListener('DOMContentLoaded', function(event) {
  // 在此处执行代码
});
  1. defer属性:将script标签的defer属性设置为true,可以使脚本延迟到文档解析完成后执行,但在DOMContentLoaded事件之前执行。例如:
<script src='script.js' defer></script>

注意:defer属性只对外部脚本文件有效。

  1. async属性:将script标签的async属性设置为true,可以使脚本在加载时异步执行,不会阻塞文档的解析和其他资源的加载。例如:
<script src='script.js' async></script>

注意:async属性只对外部脚本文件有效,并且异步执行的顺序不确定。

  1. 在script标签中直接写入代码:可以直接在script标签中编写需要在页面加载时执行的代码。例如:
<script>
  // 在此处编写代码
</script>

注意:该方式会阻塞文档的解析,因此只适合较小的脚本代码。

  1. 使用jQuery库的$(document).ready()方法:如果使用了jQuery库,可以使用其提供的$(document).ready()方法,在DOM解析完成后执行代码。例如:
$(document).ready(function() {
  // 在此处执行代码
});

注意:使用该方法需要先引入jQuery库。

除了onload,网页加载时执行代码的5种方法

原文地址: https://www.cveoy.top/t/topic/qsSx 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录