1. 程式人生 > 其它 >web前端筆記(4)-js引入

web前端筆記(4)-js引入

JS兩種引入方式

1.引用外部js檔案

直接在html裡藉助<scriptsrc="js/test.js"></script>引入js

2.在頁面中嵌入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>