三種引入javascript檔案的方式

不勝舊時光發表於2020-10-17
JavaScript
  1. 內部書寫（不推薦使用） 通過 <style> 標籤 在其內部書寫 JavaScript 程式碼。要注意 <style> 標籤的書寫位置，由於 html 程式碼的執行從上到下，會出現 JavaScript 程式碼中的需要操作元素渲染到 JavaScript 程式碼之後，這是由於相應的元素沒有載入進入，所以 JavaScript 程式碼無法獲取到。
  2. 外部引入（推薦使用） 通過<script> 的 scr 屬性來指明需要引入的 js 檔案。為了避免 js 檔案太大，載入時（瀏覽器停止渲染）檔案下載的同步問題 出現瀏覽器出現空白的問題，使用非同步載入方式下載 js 檔案，新增 async 屬性，同時為了解決上述出現的問題，新增 defer 屬性，讓所有 js 檔案再 html 文件的所有元素渲染完成後，再進行執行 js 檔案，防止出現js操作未渲染上的DOM節點無效的問題。
  3. 直接寫在標籤內部。（不推薦使用）<p onclick="alert('你點中我了');"

相關文章