標籤:parent har 相等 使用者 set 使用 等於 rem rtb
JavaScript 評論添加練習本次所學內容://var str = ‘<li>‘+value+‘</li>‘;支付串和變數的拼接 //ul.innerHTML += str;使用+=就相等於一個追加的功能如果是字串的資料想要轉換成JSON資料就可是使用JSON.parse()方法將這個轉換成JSON資料。 parse裡面存放的是要轉化的資料類型
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>3.仿照微博.html</title></head><body><textarea></textarea><button>發表評論</button><ul><!-- <li>123</li> --></ul></body><script>//1.擷取對象var textarea = document.querySelector(‘textarea‘);var btn = document.querySelector(‘button‘);var ul = document.querySelector(‘ul‘);//2.‘點擊按鈕‘,就將‘使用者輸入的資訊‘‘寫入到ul列表中‘。(3個小步驟)//點擊事件btn.onclick = function(){//(1)擷取使用者輸入的資訊var value = textarea.value;//(1-1)建立li節點var li = document.createElement(‘li‘);li.innerHTML = value;//console.log(li);//(1-4)建立a標籤(刪除)var a = document.createElement(‘a‘);a.href="javascript:;";a.innerHTML = "刪除";//(1-5)li追加一個a標籤li.appendChild(a);//(1-2)擷取ul的第一個節點var firstNode = ul.firstElementChild || ul.firstChild;console.log(firstNode);//(1-3)在第一個前添加ul.insertBefore(li,firstNode)//(2)寫入到ul列表中//var str = ‘<li>‘+value+‘</li>‘;//ul.innerHTML += str;//3.點擊新建立的a連結,刪除當前的li標籤a.onclick = function(){//找li節點 —— 通過a節點找li父節點var li = this.parentNode;//console.log(li);//刪除子節點//ul.removeChild(li節點);ul.removeChild(li);}}// 註:ul.firstElementChild 這個尋找第一個標籤沒有的話是一個文字標籤 ul.firstChild 這個尋找第一個標籤沒有的話是一個null// 所以在第一個添加的時候,insertBefore會將文字標籤和null當做第一個標籤</script></html>
JavaScript 評論添加練習