Node.js 的 30 天學習日記--第十天

Node.js 學習第十天

今天第十天來學上次剩下的。

如果在看的過程中有任何錯誤歡迎寫 E-MAIL： pp840405@gmail.com 提醒我錯誤。

todolist (下)

上一次講的事如何新增內容與顯示 darabase 的實際應用，這是學的是如何做刪除動作，新增一個刪除的邏輯與 dataset 方式。
HTML的dataset

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
// 拉出資料庫內容並渲染到網頁上
    todos.on('value',function(snapshot){
      var str ='';
      var data = snapshot.val();
      for(var item in data){
        //新增一筆dataset的資料在li上面
        str +='<li data-key="'+[item]+'">'+data[item].content+'</li>';
      }
      list.innerHTML = str ;
    })
    //刪除邏輯
    //選取要刪除的dom元素事件
    list.addEventListener('click',function(e){
      //如果點選的地方等於li元素執行內容
      if(e.target.nodeName = "LI"){
        //宣告變數點選位置的dataset值
        var key = e.target.dataset.key;
        //子目錄指定key並刪除子目錄下的內容
        todos.child(key).remove();
      }
    })

結語

基本上 database 的新增刪除讀取應用就這樣看大家玩出什麼樣的應用，有任何問題歡迎寫 MAIL： pp840405@gmail.com 一起共同討論。