JS WebAPIs DOM节点概述

1.DOM节点：DOM树里每一个内容都称之为节点

2.分类：

-元素节点：比如div标签
-属性节点：比如class属性
-文本节点：比如标签里的文字

3.查找结点

通过节点之间的亲戚关系来查找

		//父节点查找const baby = document.querySelector('.baby')console.log(baby.parentNode);//得到最近一级父节点  //子节点查找//childNodes：获得所有子节点，包括文本节点（空格换行）、注释节点等//children属性：仅获得所有元素节点，返回的还是一个伪数组const ul = document.querySelector('ul')console.log(ul.children);//查找兄弟节点const li2=document.querySelector('ul li:nth-child(2)')console.log(li2.previousElementSibling)console.log(li2.nextElementSibling)

4.增加节点

一般操作为：创建一个新的节点，把创建的新的节点放入到指定元素的内部 ，创建节点追加节点

5.删除节点

 //1.创建节点const ul=document.querySelector('ul')const li=document.createElement('div')li.innerHTML='我是li'//插入到ul的最后//ul.appendChild(div)//插入到某个元素的前面ul.insertBefore(li,ul,children[0])//元素克隆ul.cloneNode(true)//true表示连着后代一起克隆，false表示不克隆后代//删除节点ul.removeChild(ul.children[0])//注意和隐藏节点display:none区别