关于Dom的一些补充

一.节点关系

1.父子
父节点 parentElement
所有子节点 children
第一个子节点 firstElementChild
最后个子节点 lastElementChild

2.兄弟
上一个兄弟 previousElementSibling
下一个兄弟 nextElementSibling

二.属性修改

getAttribute 获取属性
setAttribute 设置属性
removeAttribute 移除属性

三.节点信息

1.js的DOM核心编程 ，每个元素都是一个节点。节点有不同类型有不同信息。

2.nodeName节点的名称:元素节点：

(1)返回的是元素标签名大写 例P

(2)文本节点：返回#text

3.nodeType节点的类型:

(1)元素节点：返回1

(2)文本节点：返回3

4.nodeValue节点的值:

(1)元素节点：返回none

(2)文本节点：返回文本内容

 四.节点的创建与插入

1.创建节点document.createElement(tag)

2.删除节点：elem.remove()
elem.parentElment.removeChild(elem)

3.复制节点 ,不带子节点 var elem2 = elem.cloneNode(false)

复制节点，带子节点 var elem3 = elem.cloneNode(true)

4.插入节点 parent.appendChild(elem) 将elem插入到parent最后面

5.插入节点parent.insertBefore(新的节点，相关节点)    把新的节点插入到 相关节点的前面

6.替换节点   parent.replaceChild(新的节点，被替换的节点)

 五.表格操作

1.创建行row = table.insertRow(index)

2.创建列col = row.insertCell(index)

3.设置列的内容col.innerText="xxx"

4.选择第一行table.firstElementChild.fristElementChild

六.select下拉框

创建一个option      var option = new Option(text,value)

插入一个option      select.add(option,before)

七.事件的监听与注册

1.DOM0 在html标签中 <h1 οnclick="callMe()">

2.DOM1 实现js与html分离
btn.οnclick=callMe;
btn.onclick = function(){}
(多次注册，只会执行最后一个)

3.DOM2 可以添加多个，也可以移除
btn.addEventListener(“click”,callMe)
btn.addEventListener("click",function(){})

4.移除全部  clickbtn.removeEventListenter("click")
移除一个  btn.removeEventListenter("click",callMe)

 嗯，这部分不是说特别难，但是容易手说我会了，脑子说不，你不会的情况，多写几个例题熟悉熟悉就好。