DOM

DOM节点

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

元素节点
属性节点
文本节点

查找节点

查找父节点

parentNode 属性

子元素.parentNode 返回最近一级的父节点找不到返回为null

查找子节点

childNodes 获得所有子节点、包括文本节点（空格、换行）、注释节点等

children 仅获得所有元素节点返回的还是一个伪数组

父元素.children

兄弟节点

nextElementSibling 属性下一个兄弟节点

previousElementSibling 属性上一个兄弟节点

增加节点

创建节点

document.createElement('标签名')

追加节点

插入到父元素的最后一个子元素父元素.appendChild(要插入的元素)

插入父元素中某个子元素前面父元素.insertBefore(要插入的元素,在哪个元素前面)

克隆节点

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

元素.cloneNode(布尔值)

布尔值若为true，则代表克隆时会包含后代节点一起克隆

若为false，则代表克隆时不包含后代节点

删除节点

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

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

时间对象

获得当前时间

let date = new Date()
//获得指定时间
let date = new Date('2021-11-18')

时间对象方法

时间戳

let date = new Date()
      data.getTime()

+new Date()

Date.now()

重绘和回流

回流(重排)

部分或者全部元素的尺寸、结构、布局等发生改变时，浏览器就会重新渲染部分或全部文档的过程称为回流。

重绘

由于节点(元素)的样式的改变并不影响它在文档流中的位置和文档布局时(比如：color、background-color、outline等), 称为重绘。

重绘不一定引起回流，而回流一定会引起重绘。

Web APIs-DOM操作

DOM