日期对象
用来表示时间的对象
作用:可以得到当前系统时间
在代码中发现了 new 关键字时,一般将这个操作称为
实例化
//创建一个时间对象并获取时间
//获得当前时间
const date = new Date()
//获得指定时间
const date = new Date('2006-6-6')
console.log(date)
因为日期对象返回的数据我们不能直接使用,所以需要转换为实际开发中常用的格式
//获得日期对象
const date = new Date() //Fri Nov 08 2024 16:17:47
//使用里面的方法
console.log(date.getFullYear()) //获得年份:2024
console.log(date.getMonth() + 1) //获得月份:11
console.log(date.getDate()) //获得日期:8
console.log(date.getDay()) //获取星期:5
//0~6所对应的是星期日,星期一,星期二,星期三,...,星期六
时间戳
算法:
- 将来的时间戳 - 现在的时间戳 = 剩余时间毫秒数
- 剩余时间毫秒数 转换为 剩余时间的 年月日时分秒 就是 倒计时时间
- 比如 将来时间戳 2000ms - 现在时间戳 1000ms = 1000ms
- 1000ms 转换为就是 0小时0分1秒
三种方式获取时间戳:
1.
使用 getTime() 方法
const date = new Date()
console.log(date.getTime())
2.
简写 +new Date()
console.log(+new Date())
3.
使用 Date.now()
无需实例化
但是只能得到当前的时间戳, 而前面两种可以返回指定时间的时间戳
console.log(Date.now())
节点操作
DOM节点
DOM树里每一个内容都称之为节点
节点类型:
元素节点
所有的标签 比如 body、 div ; html 是根节点
属性节点:
所有的属性 比如 href,class属性
文本节点:
所有的文本,
比如标签里面的文字
其他
查找节点
节点关系:针对的找亲戚返回的都是对象
父节点
子节点
兄弟节点
父节点查找:
parentNode 属性
返回最近一级的父节点 找不到返回为null
子元素.parentNode
子节点查找:
childNodes
获得所有子节点、包括文本节点(空格、换行)、注释节点等
children 属性 (重点)
仅获得所有元素节点
返回的还是一个伪数组
父元素.children
兄弟关系查找:
1. 下一个兄弟节点
nextElementSibling 属性
2. 上一个兄弟节点
previousElementSibling 属性
学习路线:
创建节点
即创造出一个新的网页元素,再添加到网页内,一般先创建节点,然后插入节点
document.createElement('标签名') //这里的标签名最好是有意义的,别自创
追加节点
要想在界面看到,还得插入到某个父元素中
插入到父元素的最后一个子元素:
父元素.appendChild(要插入的元素)
插入到父元素中某个子元素的前面
父元素.insetBefore(要插入的元素,在哪个元素前面)