背景知識
在Javascript中沒有類的概念由於沒有類的概念所以使用JavaScript中的概念，區別其他的語言的使用。
- 問題一：Javascript的作用是什麼？
問題背景：
在HTML前端開發中web 語言分爲三類
- HTML定義了網頁的內容
- CSS定義了網頁的佈局
- JavaScript 規定了網頁的行爲
- javaScript都涉及那些內容?
JavaScript 中涉及到JavaScript內置對象，瀏覽器（Browser）對象，HTML DOM 對象（HTML DOM 定義了訪問和操作 HTML 文檔的標準）。
第一部分JavaScript 中對象
- 問題一：對象的概念是什麼？
這裏的對象類似於默認繼承類的默認類，類似Java類的基本類，這些基本類可以實現基本的數據類型的創建工作。 - 問題二：屬性和方法？
每個數據類型都有默認的屬性，（類似於類的靜態成員變量），對象擁有的方法類似靜態成員方法。
舉例：
![在這裏插入圖片描述]()
對應的調用屬性和方法
![在這裏插入圖片描述]()
關於全局對象和全局屬性
結論：![在這裏插入圖片描述]()
具體的內容參考網頁：JavaScript中的兩種全局對象 詳細講述了全局對象的內容。
瀏覽器端JavaScript編程時，只需關心“window全局對象”即可。
第二部分瀏覽器（Browser）對象，瀏覽器對象模型 (BOM)
- window對象
表示瀏覽器中打開的窗口。 - Navigator 對象
包含有關瀏覽器的信息。
屬性舉例
![在這裏插入圖片描述]()
- Screen 對象
包含客戶端顯示屏幕的信息 - History 對象
顯示瀏覽器窗口中訪問過得URL。
第三部分 DOM 對象
- 問題一：什麼是DOM對象？
文檔對象模型 (DOM) 是HTML和XML文檔的編程接口。它提供了對文檔的結構化的表述，並定義了一種方式可以使從程序中對該結構進行訪問，從而改變文檔的結構，樣式和內容。DOM 將文檔解析爲一個由節點和對象（包含屬性和方法的對象）組成的結構集合。簡言之，它會將web頁面和腳本或程序語言連接起來。
發展現狀
開始的時候，JavaScript和DOM是交織在一起的，但它們最終演變成了兩個獨立的實體。JavaScript可以訪問和操作存儲在DOM中的內容，因此我們可以寫成這個近似的等式：
API (web 或 XML 頁面) = DOM + JS (腳本語言)
- 問題二：DOM中的基本概念
在 HTML DOM (Document Object Model) 中 , 每一個元素都是 節點
- 文檔是一個文檔節點
- 所有的HTML元素是元素節點
- 有的HTML屬性是屬性節點
- 文本插入到HTML元素是文本節點
- 註釋是註釋節點
DOM對象的基本分類
-
Document 對象是 Window 對象的一部分，可通過 window.document 屬性對其進行訪問。
-
問題三：Document 對象形成的基礎是什麼？
答：在瀏覽器加載文檔會形成一個文檔對象（Document）在JavaScript中訪問即可代表訪問當前的文檔。 -
什麼是事件對象？
背景
-
問題一：事件對象的由來？
答：事件對象，在事件（onclick）產生時，會瀏覽器會產生一個事件對象，然會傳遞給事件監聽函數，在不同 的時間模型中，傳遞event對象的方式是不同的。 -
問題二：如何註冊事件處理函數？
三種方式可以爲DOM元素註冊事件處理函數 -
問題三：關於關於註冊事件處理方式的區別？
使用DOM0的方式，ｍyobject.οnclick=function()。。。只能註冊一個，多個重複使用，後一個覆蓋掉前一個。 使用DOM2方式註冊事件addeventlistener(）註冊多個事件，不會覆蓋，會同時起作用：https://www.runoob.com/try/try.php?filename=tryjs_addeventlistener_add_many -
如何傳遞事件event對象？
在處理函數中，將event對象作爲第一個參數參數，可以訪問 DOM Event 接口
https://developer.mozilla.org/zh-CN/docs/Web/API/Event#DOM_Event_interface
![在這裏插入圖片描述]()
-
CSSStyleDeclaration 對象
CSSStyleDeclaration 對象表示一個 CSS 屬性-值（property-value）對的集合。對應於元素的style 屬性的值。 -
關於HTML collection 對象的使用
答案：collection 對象使用並不複雜
![在這裏插入圖片描述]()
問題：collection 與NodeList的區別是什麼？
參考網址：https://segmentfault.com/a/1190000006782004
![在這裏插入圖片描述]()
難點補充：
關於事件模型的難點是：
https://blog.csdn.net/iefreer/article/details/8573940
DOM0 的規定事件處理階段爲：冒泡階段
w3c 的事件註冊處理方式，規定了addeventlistener(。。。，) 參數element2.addEventListener(‘click’,doSomething,false) 最後一個參數爲true，則代表事件在捕獲階段被處理，false則代表事件在冒泡階段被處理。
