DOM节点增删查改

HBuilder开发工具

谷歌浏览器

1.创建文本框和按钮，div                   

2.创建增加节点，写成方法调用function aa(){     var aa=document.getElementById('btn');     aa.onclick=function(){      var divs=document.getElementById('one');         var txts=document.getElementById('txt');         // 将文本框的内容转化为文本节点                     var textNode = document.createTextNode(txts.value);                     var pss=document.createElement('P');//创建键节点         pss.appendChild(textNode);         divs.appendChild(pss);     }              }

删除节点，写成方法调用function dels(){     var oBtn = document.getElementById('btn1');               oBtn.onclick = function () {               var oUl = document.getElementById('one');               var ul_arr = oUl.getElementsByTagName('p');     if(ul_arr.length==1){        alert('这是最后一个节点了');     }else{      oUl.removeChild(oUl.firstChild);     }                    }              }

修改节点，写成方法调用function replcess(){                var a = document.getElementById('one');         var txts=document.getElementById('txt').value;//获取文本              var arr = a.getElementsByTagName('p');                  var newIi = document.createElement('p');     newIi.innerHTML=txts;      a.replaceChild(newIi,arr[0]);     }

查询节点function querys(){var count = document.getElementById('one').getElementsByTagName('p').length;     alert(count+'个节点'); }