一，回顧
首先先來回顧下DOM和事件。
1，DOM
DOM在JavaScript中是應用最廣泛的，大部分Web開發(fā)的編程語言都提供了相關的實現。給了開發(fā)者一個統一的接口。
看下面的例子:

等待頁面所有內容加載完畢后，通過getElementsByTagName()方法獲取頁面中的li元素，然后循環(huán)改變li元素顏色為紅色。
再看第二個DOM例子，例子將把第二個li元素從頁面中刪除。

現獲取到li元素的父節(jié)點ul元素，然后使用removeChild() 方法刪除ul元素下 指定的li元素。
當然也可以直接使用 parentNode來直接獲取li元素的父節(jié)點。代碼如下：

2，事件
事件是黏合應用程序中所有用戶交互的膠水。DOM和事件的是JavaScript中的黃金搭檔（呵呵，來句廣告詞），它們決定著現代Web應用程序形態(tài)的根本所在。
看下面的例子：

本例中，獲取的li元素后，然后循環(huán)給元素添加事件，添加了onmouseover和onmouseout事件。當滑入時，改變顏色，滑出時，恢復顏色。
事件是復雜多變的，上例是一個最簡單的例子，所以基本上沒遇到問題。在以后，我們將遇到 比如 事件冒泡，事件傳遞 ，取消事件等問題。
3，DOM和事件
在DOM和事件交互的基礎上產生了DHTML，它的實質就是JavaScript事件和DOM元素上CSS屬性之間的交互。DHTML存在的意思就是組合這兩個技術，然后做它的事情。
二，簡單的面向對象開發(fā)
我們先來感受一下JavaScript面向對象是怎么一個寫法。下面代碼展示了學校中的課程名和老師的信息。

最終結果會輸出“李老師 是教 英語 的?！?
在此例子的基礎上，我們再定義個函數，用來輸出所有的課程信息。代碼如下所示：

最終結果會輸出：

本例中， 數組的值都調用了 display()方法。
改進如下：
在

中的this.lec[i] 處，統一調用display()方法。然后去掉數組的值調用display()。修改后的代碼如下：

同樣也可以輸出跟上例一樣的結果。
這是一個簡單的面向對象開發(fā)的例子，隨著JavaScript逐漸被程序員所接受，設計良好的面向對象代碼也日益普及。在后面的筆記中，你將會看到更多的面向對象程序代碼。
三，小結
本章回顧了DOM和事件，然后通過例子簡單的講解了面向對象的開發(fā)。

最新評論