script标签中的async和defer
在程序中代碼是一行一行執行的,html標簽都是由渲染引擎來執行,代碼執行時從上往下一行一行執行,當執行到alert(如下圖),alert會阻塞后面代碼的執行,當點擊完確定之后,代碼繼續往下執行。
javascript的內容同樣可在外部進行引用,如下圖所示,正常情況下執行結果和上面的內容相同,但當我們給html的script標簽中加入async或者defer屬性時,代碼的執行過程也將會隨之改變。
async 為異步,顧名思義就是多個人同時做多件事,這里區分sync,sync為同步,就是一個人有序的做多件事情。因此在script標簽中加入async屬性后,程序執行時,外部引用的js文件內容和html中的代碼同時進行。在這里需要注意,因為代碼的執行速度不同,顯示的效果有可能不同,在此是js內容被下載完成后立即執行。
defer也會異步的下載去執行js內容,當然script標簽中不會有兩個相同功能的屬性,它和async的區別是什么呢?defer和async的區別就是defer下載完js的內容后不會立即執行,直到html文檔加載解析完成后才執行,下圖就是使用defer的過程,代碼雖然簡單,但是這樣可以清晰的表達defer的作用。
總結:前端項目中肯定少不了多多少少的js文件,defer和async就給我們在程序執行過程中提供了很方便的引用,更方便我們維護代碼,避免代碼中這一個那一個的js引用。
轉載于:https://www.cnblogs.com/Codegenius/p/5835635.html
總結
以上是生活随笔為你收集整理的script标签中的async和defer的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: php使用openssl进行Rsa长数据
- 下一篇: 第四十三节,文件、文件夹、压缩包、处理模