免費(fèi)AI編程助手
JavaScript 位置結(jié)構(gòu)
位置結(jié)構(gòu)
JavaScript 腳本可以很靈活的寫在幾乎 HTML 網(wǎng)頁(yè)的任何地方。
但是，在 HTML 文件中編寫的 JavaScript 腳本只可以放置在如下部分中：
- HTML 網(wǎng)頁(yè)的
<head>...</head>里。 - HTML 網(wǎng)頁(yè)的
<body>...</body>里。 - HTML 網(wǎng)頁(yè)的
<head>...</head>和<body>...</body>里。 - 外部文件里,并且引用在
<head>...</head>中。
JS只能存在在<script>標(biāo)簽中，該標(biāo)簽可以出現(xiàn)在<html>節(jié)點(diǎn)下的任意地方。另外<script>標(biāo)簽可以用來(lái)引用外部js，所以js代碼可以單獨(dú)成為一個(gè)文件獨(dú)立引入。
如下章節(jié)，我們將了解如何在上述 HTML 文件的不同的地方編寫 JavaScript 腳本。
在 <head>...</head> 之間編寫JavaScript 腳本
如果你希望在某個(gè)事件中編寫腳本，比如，當(dāng)用戶點(diǎn)擊一個(gè)按鈕時(shí)觸發(fā)一個(gè)事件。
你可以按照如下方式將腳本編寫在 <head>...</head> 結(jié)構(gòu)中
<html>
<head>
<script type="text/javascript">
function sayHello() {
alert("Hello World")
}
</script>
</head>
<body>
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>上述例子將產(chǎn)生如下效果：
在 <body>...</body> 之間編寫 JavaScript 腳本
如果你需要一段腳本來(lái)實(shí)現(xiàn)頁(yè)面加載后將信息內(nèi)容顯示在頁(yè)面中的功能。
這段腳本需要編寫在HTML文件的 <body>...</body> 部分。
這種情況下，你不需要定義任何 JavaScript 函數(shù)。
<html>
<head>
</head>
<body>
<script type="text/javascript">
document.write("Hello World")
</script>
<p>This is web page body </p>
</body>
</html>上述例子將產(chǎn)生如下效果：
Hello World
This is web page body
在<body>與<head>中編寫JavaScript腳本
你也可以同時(shí)將腳本編寫在 <body> 與 <head> 中。
<html>
<head>
<script type="text/javascript">
function sayHello() {
alert("Hello World")
}
</script>
</head>
<body>
<script type="text/javascript">
document.write("Hello World")
</script>
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>上述例子將產(chǎn)生如下效果：
在外部文件中編寫 JavaScript 腳本
當(dāng)你在工作中開始廣泛使用 JavaScript 后，你會(huì)發(fā)現(xiàn)在多 HTML 頁(yè)面中重用相同的 JavaScript 是一個(gè)不錯(cuò)的選擇。
這樣，你可以不用維護(hù)多個(gè) HTML 文件中相同的代碼。
Script 標(biāo)簽提供了在外部文件中編寫 JavaScript 腳本并引用在 HTML 文件中的功能。
下面的例子將展示如何使用 script 標(biāo)簽將外部 JavaScript 腳本文件引用在 HTML 文件中。
<html>
<head>
<script type="text/javascript" src="filename.js" ></script>
</head>
<body>
.......
</body>
</html>為了實(shí)現(xiàn)上述功能，需要將所有的 JavaScript 源代碼編寫到以 “.js” 為格式后綴名的外部文本文件中，然后按照上面的方式引用入 HTML 文件中。
例如，你可以將下面的內(nèi)容編寫到“文件名.js” 文件中，然后在 HTML 文件中引入該外部腳本文件后，你可以使用 sayHello 函數(shù)。
function sayHello() {
alert("Hello World")
}
更多建議：