JavaScript 腳本可以很靈活的寫(xiě)在幾乎 HTML 網(wǎng)頁(yè)的任何地方。
但是,在 HTML 文件中編寫(xiě)的 JavaScript 腳本只可以放置在如下部分中:
<head>...</head> 里。 <body>...</body> 里。 <head>...</head> 和 <body>...</body> 里。 <head>...</head> 中。 如下章節(jié),我們將了解如何在上述 HTML 文件的不同的地方編寫(xiě) JavaScript 腳本。
<head>...</head> 之間編寫(xiě)JavaScript 腳本如果你希望在某個(gè)事件中編寫(xiě)腳本,比如,當(dāng)用戶點(diǎn)擊一個(gè)按鈕時(shí)觸發(fā)一個(gè)事件。
你可以按照如下方式將腳本編寫(xiě)在 <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)生如下效果:
http://wiki.jikexueyuan.com/project/javascript/images/hello.png" alt="" />
<body>...</body> 之間編寫(xiě) JavaScript 腳本如果你需要一段腳本來(lái)實(shí)現(xiàn)頁(yè)面加載后將信息內(nèi)容顯示在頁(yè)面中的功能。
這段腳本需要編寫(xiě)在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)生如下效果:
Advertisements
Hello World
This is web page body
<body>與<head>中編寫(xiě)JavaScript腳本你也可以同時(shí)將腳本編寫(xiě)在 <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)生如下效果:
http://wiki.jikexueyuan.com/project/javascript/images/say-hello.png" alt="" />
當(dāng)你在工作中開(kāi)始廣泛使用 JavaScript 后,你會(huì)發(fā)現(xiàn)在多 HTML 頁(yè)面中重用相同的 JavaScript 是一個(gè)不錯(cuò)的選擇。
這樣,你可以不用維護(hù)多個(gè) HTML 文件中相同的代碼。
Script 標(biāo)簽提供了在外部文件中編寫(xiě) 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 源代碼編寫(xiě)到以 “.js” 為格式后綴名的外部文本文件中,然后按照上面的方式引用入 HTML 文件中。
例如,你可以將下面的內(nèi)容編寫(xiě)到“文件名.js” 文件中,然后在 HTML 文件中引入該外部腳本文件后,你可以使用 sayHello 函數(shù)。
function sayHello() {
alert("Hello World")
}