寫程式需要的三件事情：

1. 介面：如何改變介面
2. 監聽：如何監視事件並作出反應
3. 資料：如何與伺服器交換資料

DOM Document Object Model

讓 JavaScript 與 HTML 之間透過 DOM 這一個橋樑溝通，將 Document 當成一個物件來看，這個物件有很多的節點 (Node)，例如：


與瀏覽器溝通的方法

1. getElementsByTagName

用標籤名稱選擇元素。
例如：有一個 div：

<div>
  Hello World
</div>

let element = document.getElementsByTagName('div')
console.log(element);

就會印出一個 div 陣列：

印出陣列第 0 位：

2. getElementByClassName

用 Class Name 選擇元素。

HTML：

<div class='block'>
        Hello World～
    </div>

JavaScript：

 let element = document.getElementsByClassName('block')
            console.log(element);

Log 之後：

3. getElementById

用 Id Name 選擇元素。

4. querySelector

可以用 Class Name、標籤、Id Name 選擇元素，若同時有多個標籤，
只能選到第一個碰到的標籤。

5. querySelectorAll

可以用 Class Name、標籤、Id Name 選擇元素，若同時有多個標籤，
可以選到多個標籤。