查找节点:
查找父级:子元素.parentNode;查找最近的父级元素,返回是dom元素
查找子级: 父元素.children;是一个伪数组,可以使用遍历,不能使用forEach
兄弟级:
nextElementSibling下一个兄弟元素
previousElementSibling上一个兄弟元素
补充:
1.查找返回的都是dom对象
2.找不到返回为null
\
增加节点:
创建新节点:
let result = document.createElement(标签名称)
注意:
创建元素之后,还需要对元素设置内容和样式
内容设置:innerText innerHTML
属性设置: 元素.属性
\
追加节点:
parent.appendChild(child)
将child的元素添加到parent元素里面去(最后面)
append:追加,都是在最后面追加
\
parent.insertBofore(child, refChild)
将child元素添加到refChild的前面去;ref:相对引用参照
如果refChild元素获取不到, 会默认以appendChild形式添加
一定要传递第二个参数,否则报错
补充:
1.第二个参数可以使用查子级方法children[0]
2.追加的节点可以是新创建的 也可以是页面上已经存在 (移动)
\
克隆节点:
模板元素.cloneNode(布尔值)
false: 浅拷贝---只拷贝元素结构
true: 深拷贝---拷贝元素结构及内容
补充:
1.用于需要创建一个复杂的标签
2.前提: 页面上有一个模板节点
\
删除节点:
parent.removeChild(child):通过父元素删除直接子元素(parent是父元素,child是要删除的元素)
element.remove():删除元素本身
\
节点操作补充:
节点操作:
节点:页面中的内容都是节点,像元素,属性,文本内容,注释。。
元素节点:就是指标签元素,像p span div a img .....
属性,文本内容:之前学习过了。 innerHTML,innerText dom对象.属性
注释:但是我们也不用处理它
操作:
增加:创建元素,再实现增加:追加到最后,插入到最前面
删除:通过父删除子,删除元素本身
修改:没有
查询(获取):以前只是相对于文档获取元素:根文档查找子元素,后代元素。