No.1 —答案

15. js延迟加载和异步加载的区别,各自实现方法?

(参考:《javascript高级程序设计第3版》 P13 2.1.2 2.1.3 点击了解更多)
个人理解,欢迎指出问题和讨论。

差别主要在于�何时进行脚本的执行,如果说defer是一种�超市结账口有序排队场景,那么async就是路边摊甩卖时混乱的疯抢状态。

正常情况下,当浏览器在解析HTML源文件时如果遇到外部的script,那么解析过程会暂停,并发送请求来下载script文件,只有script完全下载并执行后才会继续执行DOM解析。

async 和 defer 标注的 script 会被立即下载,html解析不会暂停

XHTML文档中写法:

延迟脚本:defer = "defer"
异步脚本: async = "async" (读作:[ə'sɪŋk] )

区别:

defer:顺序加载,延迟执行


    
        延迟
        
        
    



延迟脚本:脚本会被延迟到整个页面都解析完毕后再运行,即“立即下载,延迟执行”,延迟是延迟到之后再执行,HTML5要求脚本按照出现顺序执行,但实际可能不同,所以最好只包含一个延迟的script脚本

为了预防有浏览器不支持的defer属性,把延迟脚本放在页面底部即“body”中内容之后是最好的选择,也可以将所有延迟脚本的代码都封装在诸如jQuery 之$(document).ready 之类的结构中。

支持情况:

IE4~IE7支持嵌入脚本的defer属性
IE8之后支持HTML5规定。
HTML5规定:defer属性只适用外部脚本文件,忽略内置脚本设置的defer属性。
浏览器:IE4 、Firefox3.5、 Safari 5 、Chrome

async:�下载完就立即执行,无序


    
        异步
        
        
    



异步脚本:目的是不让页面等待脚本的下载和执行,即“告诉浏览器立即下载脚本文件,同时异步加载页面其他内容”。
若有多个脚本文件,则不会保证脚本执行的顺序(不同于defer)。比如no2.js可能在no1.js之前执行.
异步脚本一定会在页面的load事件之前执行。

支持情况:

与defer类似,只支持外部脚本文件
浏览器:Firefox3.6 、Safari 5 、Chrome

---------------我是分割线 ----->。< -----我是分割线-------------------

你可能感兴趣的:(No.1 —答案)