defer
和 async
是两种不同的方式,用来告诉浏览器如何加载脚本
-
相同点: 都是异步加载
-
不同点:
-
async
:告诉浏览器异步加载该脚本,不阻塞页面的加载。这意味着,浏览器可以在加载页面的同时加载该脚本,不需要等待页面完全加载完成。这种情况下,脚本的执行顺序不能保证,因为它们是在不同的线程中加载的。 -
defer
:告诉浏览器在页面完全加载完成之后再加载该脚本。这意味着,当页面完成渲染时,脚本才会被加载。它保证脚本会在 DOM 加载完成之后执行,不会影响页面的其他部分。 -
总的来说,在确保不阻塞页面加载的前提下,如果希望保证脚本的执行顺序,可以使用
defer
;如果不关心脚本的执行顺序,可以使用async
。