JS 語法的放置位置
1. Intro
In HTML, JavaScript statements are "instructions" to be "executed" by the web browser.
2. In HTML
- Must be inserted between
<script>
and</script>
tags. <script type="text/javascript">
: This type attribute is not required.- (JavaScript is the default scripting language in HTML).
- EX:
<script>
function myFunc() {
alert('Hi');
}
</script>
<button type="button" onclick="myFunc()">Try it</button>
JavaScript 放在 HTML 中的
<body>
或<head>
sections 裡都行,沒有個數限制- 即使放在
<html>
之外也能 work (on Chrome)
- 即使放在
Keeping all code in one place, is always a good habit.
- It is a good idea to place scripts at the bottom of the
<body>
element. This can improve page load, because script compilation can slow down the display. - You can place an external script reference in
<head>
or<body>
as you like. The script will behave as if it was located exactly where the<script>
tag is located.
- It is a good idea to place scripts at the bottom of the
3. External JavaScript (外部的 JS 檔)
- 引用語法:
<script src="myScript.js"></script>
- External scripts (e.g. "myScript.js") 裡直接就是JS語法,不用也不能再有
<script>
標籤(因為這是HTML標籤) - 外部JS檔的優點
- It separates HTML and code
- It makes HTML and JavaScript easier to read and maintain
- Cached JavaScript files can speed up page loads
簡單來說就是:更易維護+有助於JS快取來加強頁面讀取速度