亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

JavaScript 放在哪里?

JavaScript 放在哪里

剛才我們編寫了第一個(gè) JavaScript 程序,強(qiáng)調(diào)過(guò) JavaScript 代碼必須放置在 <script>……</script> 標(biāo)簽里。

我們把包含代碼的 <script>……</script> 標(biāo)簽放在了 <body>……</body> 標(biāo)簽里。其實(shí)不止可以這樣做,我們還有另外兩種方式在 HTML 中使用 JavaScript 。

head 中的 JavaScript

我們除了可以把包含代碼的 <script> 標(biāo)簽放在 <body>……</body> 標(biāo)簽里,還可以把它放在 <head>……</head> 標(biāo)簽里,比如這樣:

<html>
<head>
<h1> JavaScript in head. </h1>
<script>
alert("hello word!");
</script>
</head>
<body></body>
</html>

這個(gè)程序的執(zhí)行結(jié)果和剛才的沒什么不同,但其實(shí)把 JavaScript 代碼放在 <head></head> 和放在 <body></body> 里是有區(qū)別的:

簡(jiǎn)單地說(shuō),放在 <head></head> 里的會(huì)比放在 <body></body> 先執(zhí)行。head 標(biāo)簽里的代碼會(huì)在頁(yè)面還未開始繪制之前被解析,而在 body 里的代碼則會(huì)在頁(yè)面渲染的同時(shí)在讀取到這段代碼的時(shí)候才被執(zhí)行。

外部的 JavaScript

除了直接把 JavaScript 代碼寫在 HTML 里,我們還可以把 JavaScript 的代碼寫在一個(gè) js 文件中,在 HTML 里調(diào)用這個(gè) js 文件。我們還是以“hello world”舉例。

在實(shí)驗(yàn)樓環(huán)境中,把以下代碼保存并命名為“out.js”,放在桌面上:

alert("hello word!");

把以下代碼保存并命名為“test2.html”,放在桌面:

<html>
<head>
<h1> my JavaScript code in "out.js" </h1>
</head>
<body>
<script src="out.js"></script>
</body>
</html>

同樣,雙擊桌面上的“test2.html”文件,調(diào)用瀏覽器運(yùn)行,你會(huì)發(fā)現(xiàn)運(yùn)行效果和前兩個(gè)程序也沒什么區(qū)別。

其實(shí),前兩種方式都是直接把 JavaScript 代碼放在 HTML 中,在頁(yè)面加載的同時(shí),那些 JavaScript 的代碼就被解析了。而把 JavaScript 代碼放在外部文件中,只有在事件被觸發(fā),需要該段 JavaScript 代碼時(shí),才調(diào)用執(zhí)行。

這樣做有個(gè)好處,當(dāng)頁(yè)面比較復(fù)雜的時(shí)候,把大量的 JavaScript 代碼放到外部文件,只有在需要的時(shí)候才執(zhí)行,那么會(huì)明顯地加快頁(yè)面加載速度。

在一個(gè) HTML 文件中,不同位置加入不同的 JavaScript 代碼,運(yùn)行觀察不同位置的 JavaScript 代碼執(zhí)行的順序。

參考如下,觀察彈框順序:

<html>
<head>
<script>
alert("in head");
</script>
</head>
<body>
<script>
alert("in body");
</script>
</body>
</html>


Weiter lernen
||
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title> RunJS 演示代碼 </title> <script> var ck = function(){ var x = prompt ("輸入數(shù)據(jù): ", ""); alert(x); } </script> </head> <body> <button onclick="ck();"> 輸入按鈕 </button> </body> </html>
einreichenCode zurücksetzen