js节点操作

尤所不同

于 2022-10-23 22:09:38 发布

阅读量558

点赞数

分类专栏： JavaScript 文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/qq_52175048/article/details/127472589

版权

43 篇文章 2 订阅

订阅专栏

DOM节点

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

**元素节点：**所有的标签比如body、div，html是根节点
属性节点：所有的属性比如href
文本节点：所有的文本
在这里插入图片描述

查找父节点用那个属性？
parentNode
查找所有子节点用那个属性？
是一个伪数组
children
查找兄弟节点用那个属性？
nextElementSibling
previousElementSibling

即创造出一个新的网页元素，再添加到网页内，一般先创建节点，然后插入节点

//创造一个新的元素节点
document.createElement('标签名')
//插入到这个父元素的最后
父元素.appendChild(要插入的元素)
父元素.insertBefore(要插入的元素，在那个元素前面)

克隆节点
cloneNode会克隆出一个跟原标签一样的元素，括号内传入布尔值

若为true,则代表克隆时会包含后代节点一起克隆
若为false,则代表克隆时不包含后代节点
默认为false

//克隆一个已经有的元素节点
元素.cloneNode(布尔值)

在JavaScript原生DOM操作中，要删除元素必须通过父元素删除

父元素.removeChild(要删除的元素)

1.如不存在父子关系则删除不成功
2.删除节点和隐藏节点（display:none)有区别的：隐藏节点还是存在的，但是删除，则从html中删除节点

关注

专栏目录