跳至主要內容
  • Hostloc 空間訪問刷分
  • 售賣場
  • 廣告位
  • 賣站?

4563博客

全新的繁體中文 WordPress 網站
  • 首頁
  • window.onload 和 async 的执行顺序有区别吗,哪个先执行?
未分類
17 5 月 2020

window.onload 和 async 的执行顺序有区别吗,哪个先执行?

window.onload 和 async 的执行顺序有区别吗,哪个先执行?

資深大佬 : lisisi 1

<script>
Window.onload = (function(){…})()
</script>

和

<script async src=”IIFE.js”></script>
// IIFE..js
(function(){…})()

这两种方式的执行先后顺序,有什么区别吗?

大佬有話說 (8)

  • 資深大佬 : areless

    onload 页面图片资源加载完成后。下面的是 dom 刷出来。最大的不一样就是,获取页面图片资源长宽时,下面那种可能获取不到哦

  • 資深大佬 : qwertyegg

    下面那个异步完全不知道什么时候执行吧。如果网速很慢,可能页面还没加载出来就射出去了

  • 資深大佬 : azcvcza

    这个估计要翻 spec 了

  • 資深大佬 : serenader

    async 先执行,然后才是 onload 。其实写个 demo 跑一下就知道了。

    async 是指脚本的加载不会阻塞页面后续资源的加载,它自己的执行时间不确定。

    而 onload 之所以比 async 晚执行是因为 onload 本身的定义就是在页面所有资源加载完成之后才会触发,而 async 脚本也算是页面的资源,所以 onload 是在 async 脚本之后才触发。同样的道理,defer 也是一样。

  • 資深大佬 : serenader

    顺便贴一下以前写的文章: https://blog.serenader.me/bu-tong-jiao-ben-jia-zai-fang-shi-dui-domcontentloaded-shi-jian-yi-ji-load-shi-jian-de-ying-xiang

  • 資深大佬 : lihongming

    1. js 是顺序执行的,哪一行写在前面就先执行哪一行。

    2. onload 是个生命周期的钩子函数,执行这一行代码的意义是给 load 这个事件指定一个回调函数。并不是立即执行,而是 load 事件发生后才执行。

    3. async 函数被执行时,可以想象为新开一个线程,如果没指定 await 的话,就会与你后面的代码并行执行。换句话说,async 函数一旦开始执行,就各玩各的了,何时执行完成你无法预期。

    以上措辞并不严谨,学术派会喷死我的,但希望能帮到你更好地理解 js 的执行时机

  • 資深大佬 : imswing

    @lihongming 注意审题

  • 資深大佬 : lihongming

    @imswing 审了,我觉得答案是不定,所以讲讲原理,自己根据实际情况想吧。

文章導覽

上一篇文章
下一篇文章

AD

其他操作

  • 登入
  • 訂閱網站內容的資訊提供
  • 訂閱留言的資訊提供
  • WordPress.org 台灣繁體中文

51la

4563博客

全新的繁體中文 WordPress 網站
返回頂端
本站採用 WordPress 建置 | 佈景主題採用 GretaThemes 所設計的 Memory
4563博客
  • Hostloc 空間訪問刷分
  • 售賣場
  • 廣告位
  • 賣站?
在這裡新增小工具