你只要自己跟自己比較，今天比昨天進步，就值得歡天喜地了！

筆記型實作:

＃會先摘錄小專案所需要知識點
＃跟著實作一次
＃kata道館實作：關掉全部資源，重新實作-放上youtube當作自己的kata練習軌跡

所需知識點：

＃練習1:

• 描述：當滑鼠點擊“標題內容”，觸發click事件，印出e.target的文字內容以及e.target的屬性.class的值
  • DOM selector
  • eventlistener
  • event: click
  • event 會回傳一大包物件PointerEvent{..}裡面很多方式可以使用
  • e.target
  • 取值getAttribute('class')
    

＃練習2:範圍取值(或稱父元素委派事件)

• 描述：當滑鼠點擊“檢視”按鈕，才會觸發click事件，並執行事件內容，印出console
  • 排除法判斷式
  • e.target.nodeName “節點名稱/標籤元素名大寫字串” 或是 e.target.tagName也同樣
    
• 或是換一個方式用e.target.getAttribute()下判斷式

＃練習3： data- 自訂屬性妙用

* data-自訂屬性="值"
* 假設你在html某標籤內自定義屬性 data-pickme = "youPickMe"
* 取值方式1：仍然可以用.getAttribute('data-pickme')
* 取值方式2:用dataset取值，如：e.target.dataset.pickme

進入實作:

＃主題：在codepen挑一個todolist復刻
＃切版部分-html/css
＃JS功能大方向流程：增/刪/修/查
1.資料初始化渲染

* 透過js渲染html資料>comment掉html的todolist事項
* 會需要"資料">arr?obj?可以思考如何設計資料
* 資料透過forEach template literals渲染後，再存入畫面上
* 最後,再利用函式封裝起來

2.todo新增功能
3.todo完成功能
4.todo查詢功能
5.todo刪除功能

Kata練武大道！

＃kata連結：
＃練習第幾次？
＃耗費時間？