前一節(jié)課是體會一下JavaScript的各種用途，并寫出了HelloWorld程序。
這節(jié)課來講解JavaScript的各種語法規(guī)范和格式。
將onclick事件的JavaScript代碼移到head中
前一節(jié)課，點擊按鈕事件之后，可以編輯修改網頁的內容。用途雖好，但是將代碼都擁擠在HTML內容當中，并不是一種好的格式和規(guī)范。那么該如何修改呢？
可以將JavaScript代碼從input的onclick事件轉移到head里面去。
修改testjs.html如下：
刷新頁面，然后點擊Click按鈕：
可以看到結果與之前的效果是一樣的。
這里面可以看到代碼修改了，在onclick事件里面調用的是一個函數(shù)changeContent，而在head當中的<script>標簽當中遇險定義好了changeContent函數(shù)。這就是函數(shù)的用法。
JavaScript函數(shù)定義
函數(shù)的概念，如果大家之前學習過第1章，則并不陌生。
通過將一段代碼組織在一起并用函數(shù)定義起來，就可以很方便的被使用。
通常，都是將函數(shù)定義在head里面，然后在網頁控件的事件發(fā)生時進行調用。
這樣的好處很明顯，可以將所有的JavaScript代碼組織在一起，更利于組織和調用。
JavaScript函數(shù)定義方法如下：
function 函數(shù)名(參數(shù)1,參數(shù)2...){
函數(shù)內執(zhí)行代碼;
}
函數(shù)必須以function進行定義，類似于python的def。
參數(shù)可以為0個，1個或者多個，用括號括起來，用逗號分隔。
函數(shù)體用左右花括號進行限定，花括號內部時JavaScript執(zhí)行代碼。
JavaScript代碼和網頁內容分離
和之前的CSS代碼一樣，除了可以直接寫在head的script標簽之內，JavaScript代碼用可以通過引用外部文件的方式來完成。
這樣的好處也是很明顯的，就是將網頁顯示內容和對網頁的操作代碼進行分離，更容易進行維護，也更有利于組織代碼，方便不同的網頁去引用相同的JavaScript代碼功能。
可以稱之為外部JavaScript文件，它的文件名一般都是以.js結尾。
如果需要使用外部JavaScript文件，可以通過script標簽的src屬性來引用。
唯一要注意的一點是外部JavaScript文件里面不可以包含script標簽。
下面來修改代碼，改為調用外部JavaScript文件。
新創(chuàng)建一個文件，文件名為testjs.js。將函數(shù)changeContent整體內容移動到testjs.js文件中。并將文本修改顏色改為綠色。
testjs.js代碼內容如下：
修改testjs.html文件內容：
刷新頁面，點擊Click按鈕，可以看到外部JavaScript文件起作用了。
document.getElementById函數(shù)
可以看到函數(shù)changeContent里面的2行代碼的：
document.getElementById('testid').innerHTML='學哥是西門吹雪';
document.getElementById('testid').style.color='green';
這里重點的關鍵語句是document.getElementById，它的作用就是用戶訪問網頁的某個元素。
它是通過網頁元素的id屬性來進行定位和訪問的。
document是一個JavaScript內部對象實例，意思就是JavaScript代碼當前所在的這個網頁的對象的實例引用。
至于什么是“對象”和“實例”的概念，如果有其他編程語言經驗的可能比較好理解，但是初學者可能不太理解。
大致解釋一下，“對象”就是一種抽象概念的集合，而“實例”就是對象抽象概念的具體化。
一個對象用于定義某一類概念的抽象意義，而實例就是滿足對象抽象概念的具體化引用。
用一個比喻來形容，“轎車”就是一個對象，它是定義某一類事物的概念，但它不能拿來直接使用。
而“一輛奔馳C180”就是“轎車”的一個實例，它是一個具體的事物，可以拿來直接使用，而且它滿足對對象的定義。
每個對象都具有一些方法可以操作，例如“轎車”可以啟動、停止、前進、后退或轉彎等方法。
那么對象的實例就可以使用這些方法進行操作。
同樣的，“一輛桑塔納2000”同樣是“轎車”的一個實例，同樣可以使用這些方法進行操作。
可以看到，針對的某個事物的概念，對象只有一個，而實例可以有無數(shù)個。
更詳細的講解這里就不深入了，大家掌握一個基本的了解就夠了。隨著今后更多的編程語言學習，會逐步掌握的。
document是Document對象的一個實例，它有一個方法是getElementById，返回值是網頁中的一個元素對象的實例。
通過對這個返回值的繼續(xù)操作，就可以改變網頁元素的內容或者樣式。
innerHTML就是指網頁元素的內容，而style就是網頁元素的style樣式屬性，而style.color就是網友元素的顏色樣式屬性。
通過賦值語句=就可以設置對應的元素內容和樣式。
JavaScript代碼執(zhí)行規(guī)則
JavaScript代碼是向瀏覽器發(fā)出指示，告訴瀏覽器應該如何執(zhí)行處理。
它是單步執(zhí)行的，通常都在每句結尾用分號結束。
執(zhí)行代碼可以是定義變量、賦值語句、判斷語句、循環(huán)語句或者調用其他函數(shù)的語句。
執(zhí)行代碼是按照順序進行執(zhí)行的，但是也可以通過分支語句和循環(huán)語句實現(xiàn)更多更復雜的邏輯。
例如上節(jié)課的下列語句：
if (document.getElementById('password').value.length<6) {
alert('密碼長度不能少于6位！');
} else {
alert('Check OK');
}
可以看到，if語句和以前學習過的python語法格式不一樣。
if后面是一個用()左右括號包起來的一個邏輯判斷式，根據(jù)邏輯判斷式的結果是True還是False來執(zhí)行不同的代碼。
這一點和python也是一樣的邏輯，只是代碼規(guī)范不同而已。
JavaScript代碼是大小寫敏感的
JavaScript代碼是大小寫敏感的，這一點和第2章的html代碼是不一樣的。
來試驗一下，將getElementById修改為全部小寫的getelementbyid看看：
修改testjs.js代碼：
刷新頁面，點擊Click按鈕，可以看到網頁內容和樣式沒有變化，說明代碼不起作用。
那么這里有點不好判斷了，是代碼出錯了，還是什么其它原因呢。
其實可以通過之前使用過的瀏覽器調試工具來進行調試。
通過鼠標右鍵“檢查”菜單，打開瀏覽器調試工具。
在最下方的Console窗口里面可以看到提示JavaScript代碼出錯了，而且很明白的知道是哪一行出錯了，出的什么錯誤。
空格和折行
JavaScript會忽略多余的空格，可以通過添加空格來讓代碼更有可讀性。
將剛才的小寫錯誤修改正確，并添加空格。
testjs.js代碼修改如下：
然后刷新頁面重新執(zhí)行，可以看到網頁執(zhí)行沒有錯誤了，空格不影響代碼。
同樣的，如果一行代碼中的文本字符串過長，也可以使用折行提高可讀性。
通過在文本字符串中使用反斜杠來對代碼進行折行。
testjs.js代碼修改如下：
刷新網頁，可以看到網頁正常執(zhí)行：
但是，如果不是文本字符串，使用反斜杠，則會出錯：
testjs.js代碼修改如下：
刷新網頁，可以看到控制臺顯示的錯誤。
JavaScript注釋
和CSS代碼一樣，可以對JavaScript代碼進行注釋，達到暫時不執(zhí)行被注釋的代碼的目的，或者是對代碼進行說明的目的。
單行注釋以//開頭，多行注釋使用/開頭，/結尾。
給代碼添加2段注釋，將錯誤代碼注釋掉，添加正確的代碼。
testjs.js代碼修改如下：
刷新網頁重新執(zhí)行，可以看到注釋內容不影響代碼實際執(zhí)行，網頁正常執(zhí)行了。
