async 和 defer 是 HTML 中用於加載外部 JavaScript 檔案時的兩種不同屬性，它們影響著腳本的加載和執行方式。讓我為您解釋這兩者的差異：
async
- 當使用
async 時：當瀏覽器遇到 <script async src="..."></script> 標籤，它會在背景中非阻塞方式加載腳本。這意味著 HTML 的解析過程不會因為腳本的加載而停止。
- 腳本加載完畢後：一旦腳本加載完畢，HTML 的解析將會暫停，腳本隨即執行。
- 主要用途：
async 適用於那些不依賴於其他腳本或者頁面的其餘部分的腳本，例如計數器或廣告。
defer
- 當使用
defer 時：與 async 類似，<script defer src="..."></script> 也允許瀏覽器在背景中加載腳本，同時不會阻塞 HTML 的解析。
- 不同之處：
defer 腳本會在整個頁面解析完畢後才執行，確保在執行腳本之前，所有的 HTML 都已加載完成。
- 主要用途：
defer 適用於那些需要在文檔解析後運行的腳本，或者依賴於文檔其他部分的腳本，如操作 DOM 的腳本。
總結
async 和 defer 都是為了提高網頁的加載效率而設計的。它們允許瀏覽器並行加載腳本，同時不會影響 HTML 內容的解析。
- 關鍵區別在於它們執行腳本的時機：
async 是一旦腳本加載完畢立即執行，而 defer 則是等到整個頁面解析完畢後才執行。
