在HTML文件中,可以使用以下5種方式引入JavaScript文件:
1.內聯方式(Inline):
在HTML的<script>
標簽中直接編寫JavaScript代碼。
示例:
<script>// JavaScript代碼
</script>
2.外部文件方式(External file):
將JavaScript代碼保存為一個獨立的文件,并通過src
屬性鏈接到HTML文件中。
示例:
<script src="script.js"></script>
3.內部文件方式(Internal file):
在HTML文件中使用<script>
標簽并將JavaScript代碼放在其中,但不指定外部文件路徑。
示例:
<script type="text/javascript">// JavaScript代碼
</script>
4.動態加載方式(Dynamic loading):
使用JavaScript的createElement
和appendChild
方法來動態創建和插入<script>
標簽。
示例:
var script = document.createElement('script');
script.src = 'script.js';
document.body.appendChild(script);
5.按需加載方式(Lazy loading):
使用defer
或async
屬性來控制腳本的加載和執行時機。
defer
屬性表示腳本將在文檔解析完畢后執行,同時保持腳本的異步加載,多個延遲腳本按順序執行。
示例:<script src="script.js" defer></script>
async
屬性表示腳本將在下載完成后立即執行,不會阻塞頁面的解析和渲染。
示例:<script src="script.js" async></script>
請注意,以上引入方式可以單獨使用,也可以組合使用,根據實際需求選擇合適的方式。