Web APIs 第三天 DOM节点操作

1.查找节点

​ 查找父节点： 子元素.parentNode

​ 查找子节点： 元素.childNodes 查找的是所有的子节点（文本节点(空格、换行)、元素节点）

​ 元素.children 查找的是所有的元素节点

​ 元素.firstchild 查找的是第一个节点

​ 元素.firstElemetChild 查找第一个元素节点

​ 元素.lastchild 查找的是最后一个节点

​ 元素.lastElemetChild 查找最后一个元素节点

​ 元素.nextElementSibling 查找下一个兄弟节点

​ 元素.previousElementSibling 查找上一个兄弟节点

2.创建、追加节点

​ 创建节点：document.creatElement('标签名')

​ 追加节点：父元素.appendChild(要插入的元素) 在父元素的最后加子元素

​ 父元素.insertBefore(新，旧) 在指定位置添加子元素

3.克隆节点

​ 克隆节点：元素.cloneNode(布尔值) 默认是false，如果是true，就会把克隆的元素的子元素都一起克隆，false只克隆本元素

4.删除节点

​ 删除节点：父元素.removeChild(要删除的元素) 删除节点是删除了，display：none；是隐藏了

5.节点的属性

节点的属性：nodeType：查看节点类型 1为元素节点，2为属性节点，3为文本节点

​ nodeName：查看节点名称 元素节点返回大写的标签名，文本节点返回#text

6.时间对象

​ 介绍：用来表示时间的对象

​ 两种方法创建：获取当前时间 let date = new Date（）；

​ 获取指定时间 let date = new Date（'1999-2-3'）;

​ 事件对象方法：变量.getFullYear() 获取年

​ 变量.getMonth() 获取月 注意：月是0-11，计算当前的话要+1

​ 变量.getDate() 获取日

​ 变量.getDay() 获取星期 注意：星期是0-6，计算当前的话要+1

​ 变量.getHours() 获取小时

​ 变量.getMinutes() 获取分钟

​ 变量.getSeconds() 获取秒数

7.时间戳

​ 从1970年1月1日 0点0时0分0秒开始计算到现在的毫秒数

​ 获取时间戳三种方法：可以用别的时间 date.getTime() 、date.(+ new Date())

​ 只可以用当前时间 Date.now()

​ 本地日期时间显示 toLocaleString()

​ 获取毫秒数 getMilliseconds

8.重绘和回流

​ 回流：改变页面的布局会回流重排

​ 重绘：不改变页面的布局，比如改变color、backgroundcolor、outline等

重绘不一定引起回流，回流一定引起重绘