我們今天就來將最後的部分講解完吧~

    el.scrollTop = el.scrollHeight;
    // 輸入成功後清除輸入欄內容
    if (message == el.innerHTML) {
      textInput.value = ""
    }

看我們的第一段 el.scrollTop = el.scrollHeight;
這段的用意是我想讓聊天室只要有更新訊息，
就能讓畫面呈現在最新的訊息上。

• scrollTop
  是用來設置和獲取元素被向上捲動的高度，
  元素的 scrollTop 是元素頂端和能被看見的最頂端之間的距離，
  當元素並未產生滾動條，
  那麼 scrollTop 的值預設為 0。
• scrollHeight
  其實也不用特別講解，
  就是獲取元素的高度。

所以將向上捲度的高度等於聊天室的高，
那麼更新訊息時就會讓畫面自動向下滾動。
最後將訊息送出後就將輸入訊息重製，
就不會有輸出的訊息還再輸入格裡。
那麼目前聊天室的基本功能都完成了，
後面就是再看有什麼問題要修改，
或是增加什麼功能這樣~