您好,登錄后才能下訂單哦!
本篇內容主要講解“JavaScript的同步加載和異步加載關系是什么”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強。下面就讓小編來帶大家學習“JavaScript的同步加載和異步加載關系是什么”吧!
在引入JavaScript腳本代碼時,頁面的下載和渲染都會暫停,等待腳本執行完成后才會繼續,這種加載方式稱為“同步加載”。“同步加載”也稱“阻塞模式",它是JavaScript腳本代碼默認的加載方式,之所以要同步加載,是因為JavaScript中可能有輸出、修改等行為,所以默認同步執行才是安全的怛是“同步加載”也有弊端。
同步加載完畢之前,頁面內容是無法正常顯示的,這就給網站訪問者帶來不好的用戶體驗。因此在代碼加栽過程中,我們需要讓那些負頁面內結構、樣式的代碼先加載,給用戶呈現一個美觀的界面效果,然后再加后續的腳本代碼,這時就需要用到“異步加載”。“異步加載”也稱“非阻塞模式”,用于降JavaScript阻塞問題對頁面造成的影響,使用< script>標記屬性async和defer都可以設置 “異步加載”。
下面將介紹這兩種屬性的使用方法。
1、async添加async屬性后,頁面會先下載腳本文件,不阻塞結構代碼、樣式代碼的執行,當腳本文件下載完成后再執行該腳本文件,示例代碼如下:
< script src=http://js.test/file.js” async>< /script>
2、defer添加defer屬性后,頁面會先下載腳本文件,不阻塞結構代碼、樣式代碼的執行,當頁面效果加載完成之后,再執行腳本代碼,示例代碼如下:
< script src=http://js.test/file.js” defer>< /script>
值得一提的是,雖然async和defer都用于設置異步加載,但二者在腳本代碼下載完之后的執行方式有很大差別。添加async屬性,當腳本代碼下載完成之后會立即執行腳本代碼;添加defer屬性,會等頁面效果加載完成之后再加載腳本代碼。
到此,相信大家對“JavaScript的同步加載和異步加載關系是什么”有了更深的了解,不妨來實際操作一番吧!這里是億速云網站,更多相關內容可以進入相關頻道進行查詢,關注我們,繼續學習!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。