javascript高級程序設計學習記錄之defer和async屬性區別
1. 因爲解釋器在解析執行js代碼期間會阻塞該javascript便籤後面的的渲染 舉個簡單的例子：javascript
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<script type="text/javascript">
var test=document.getElementById('test');
console.log(test)
</script>
</html>
<body>
<div id="test"> zhanhui</div>
</body>
2.沒有defer或者async屬性，瀏覽器會當即加載並執行相應的js腳本，這樣就會影響後續的文檔內容的渲染加載html
3.有async屬性，後續頁面的一些操做（例如文檔的加載和渲染）是和js腳本加載執行是並行的，js高級編程設計中說道，當即下載該js腳本而且加載完成就執行，不考慮依賴，但不妨礙頁面的其餘操做，而且只對外部腳本有效java
4.有defer，當即下載該js可是會等到HTML文檔被徹底加載和解析完成以後執行，執行的順序也是按照加載的順序（當即下載，但延時執行）編程
另外還有幾個小知識點： 一、帶有src屬性的script元素不該該在其標籤之間在包含js代碼，若是有，則只會下載並執行外部js，嵌入的js則會被忽略瀏覽器
二、瀏覽器在遇到body標籤時纔開始呈現內容，因此咱們將script標籤放在body標籤內容的後面也就是</body>以前async
相關文章
- 1. JavaScript高級程序設計筆記之 延遲異步腳本 defer async
- 2. script標籤中defer，async屬性區別
- 3. Js中的defer屬性和async屬性
- 4. defer和async的區別
- 5. 【Js】defer和async的區別
- 6. HTML5 defer和async的區別
- 7. js defer和async的區別
- 8. 《Javascript高級程序設計》學習記錄（三）
- 9. 《javascript高級程序設計》學習記錄（四）
- 10. 《javascript高級程序設計》學習記錄（五）
- 更多相關文章...
- • XML DOM 高級 - XML 教程
- • XML DOM async 屬性 - XML DOM 教程
- • Tomcat學習筆記（史上最全tomcat學習筆記）
- • 適用於PHP初學者的學習線路和建議
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
