JS知识点09

dom节点

1，dom节点的分类：元素节点（Element)；属性节点（attribute)；文本节点

2，元素节点：获取元素节点，在获取节点时需要使用一个JS内置的全局变量（document）。常用的获取元素节点的方法：

document.getElementById--根据标签id属性值获取标签

document.getElementsByClassName--根据标签的class属性值获取标签

document.getElementsByTagName--根据标签的标签名获取标签

document.getElementsByName--根据标签的name属性值获取标签

document.querySelector--根据指定的选择器获取第一个满足条件的元素节点

document.querySelectorAll根据指定的选择器获取满足条件的所有元素节点

3,添加标签：document.createElement；JS动态创建标签，.innerHTML;mark.appendChild(); //在指定标签的内部所有内容的最后添加标签，innerText和innerHTML的区别：前者只能识别文本数据，只能用来设置指定标签的文本内容。后者可以识别文本数据也可以正常识别DOM结构，一般用来执行对应标签子级内容。注意 innerText和innerHTML是针对于非form表单控件子级内容的操作。form表单空的则是value属性。.appendChild();

4，标签的替换：.replaceChild( ， );完成标签的替换:参数1代表用来替换的节点元素，参数2代表被替换的子级节点元素

5，删除标签：.remove()删除当前的标签，注意该删除操作是将当前标签和标签内部的内容一起删除

6，常用的元素节点属性：

className--设置标签的class值

style--设置或获取标签的css样式（注意只能获取行间样式）

children-元素属性，获取指定元素node的所有直接子级元素节点

childNodes--元素属性，获取指定元素node的所有直接子级节点（包含文本节点）

firstChild--元素属性，获取指定元素的第一个节点（可能是元素节点也可能是文本节点）

firstElementChild--元素属性，获取指定元素的第一个元素节点

parentElement-获取元素的直接父级元素节点，parentNode-获取元素的直接父级节点

previousElementSibling--获取指定元素的相邻上一个兄弟元素节点

nextElementSibling--获取指定元素的相邻下一个兄弟元素节点