大家好，我是IT修真院武汉分院第13期学员，一枚正直善良的web程序员。
今天给大家分享一下，修真院官网js4任务中可能会使用到的知识点：
常见DOM操作有哪些？
小课堂
DOM常用操作
1.查找节点
2.添加新节点
3.删除节点
4.修改节点
1、查找节点
1、document.getElementById('id属性值');
返回拥有指定id的第一个对象的引用
2、document/element.getElementsByClassName('class属性值');
返回拥有指定class的对象集合
3、document/element.getElementsByTagName('标签名');
返回拥有指定标签名的对象集合
4、document.getElementsByName('name属性值');
返回拥有指定名称的对象结合
5、document/element.querySelector('CSS选择器');
仅返回第一个匹配的元素
6、document/element.querySelectorAll('CSS选择器');
返回所有匹配的元素
7、document.documentElement
获取页面中的HTML标签
8、document.body
获取页面中的BODY标签
2.添加新节点
1、parent.appendChild( element/txt/comment/fragment );
向父节点的最后一个子节点后追加新节点
2、parent.insertBefore( newChild, existingChild );
向父节点的某个特定子节点之前插入新节点
3、element.setAttributeNode( attributeName );
给元素增加属性节点
4、element.setAttribute( attributeName, attributeValue );
给元素增加指定属性，并设定属性值
3.删除节点
1、parentNode.removeChild( existingChild );
删除已有的子节点，返回值为删除节点
2、element.removeAttribute('属性名');
删除具有指定属性名称的属性，无返回值
3、element.removeAttributeNode( attrNode );
删除指定属性，返回值为删除的属性
4.修改节点
1、parentNode.replaceChild( newChild, existingChild );
用新节点替换父节点中已有的子节点
2、element.setAttributeNode( attributeName );
若原元素已有该节点，此操作能达到修改该属性值的目的
3、element.setAttribute( attributeName, attributeValue );
若原元素已有该节点，此操作能达到修改该属性值的目的
今天的分享就到这里啦，欢迎大家点赞、转发、留言、拍砖~
技能树-IT修真院
IT修真院是一个免费的线上IT技术学习平台 。
每个职业以15个左右的task为初学者提供更快速高效的学习方式 ；
所有task均是从真实项目中提炼出来的技能点，
强调实战演练+自学优先+师兄辅导的学习方式，
严格的日报体系，欢乐的交流讨论学习气氛，更有无数师兄师姐帮你解疑
