web前端筆記(4)-js引入
阿新 • • 發佈:2021-11-24
JS兩種引入方式
1.引用外部js檔案
直接在html裡藉助<scriptsrc="js/test.js"></script>引入js2.在頁面中嵌入js
這是在頁面使用js最簡單的方式了,一般我在寫個小測試的情況下會用這種方式。
把script元素寫在</body>前面,script元素的內容就是js程式碼。像這樣:
<script> // 在這裡寫js function test(){ alert('hello,world'); } test(); </script>
script元素在HTML檔案中的位置
如果把script元素放在head元素裡,就像這樣:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="xxx.js"></script> </head> <body> <!--頁面內容--> </body> </html>
這樣做的話,待瀏覽器經過下載、解析、執行完js檔案之後,才會呈現頁面內容。如果一個頁面需要很多個js檔案,那麼瀏覽器可能會出現很多問題,使用者體驗不好。
因此,正確的位置應是:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> </body> </html> <script> <--js內容--> </script>