JS API&日期对象
目标：掌握日期对象，可以让网页显示日期
-
日期对象：用来表示时间的对象
-
作用：可以得到当前系统时间
实例化
目标：能够实现实例化日期对象
-
在代码中发现了new关键字时，一般将这个操作称为实例化
-
创建一个时间对象并获取时间
获得当前时间
const date = new Date();获得指定时间
const date = new Date('2008-8-8'); console.log(date);
日期对象方法
目标：能够使用日期对象中的方法写出常见日期
使用场景：因为日期对象返回的数据我们不能直接使用，所以需要转换实际开发中常用的格式
时间戳
目标：能够获得当前时间戳
-
使用场景：如果计算倒计时效果，当面方法无法直接计算，需要借助于时间戳完成
-
什么是时间戳：
-
是指1970年01月01日00时00分00秒起至现在的毫秒数，它是一种特殊的计量时间的方式
-
-
算法：
-
将来的时间戳 - 现在的时加戳 = 剩余的时间毫秒数
-
剩余时间毫秒数 转换为 剩余时间的 年月日时分就是倒计时时间
-
比如 将来时间戳2000ms - 现在时间戳 1000ms = 1000ms
-
1000ms 转换为就是 0小时0分1秒
-
三种方式获取时间戳
-
使用getTime()方式
-
简写+ new Date（）
-
使用Date.now()
-
无需实例化
-
但是只能得到当前的时间戳，而前面两种可以返回指定时间的时间戳
-
节点操作
DOM节点
-
DOM树里每一个内容都称之为节点
节点类型
-
元素节点
-
所有的标签 比如body、div
-
html是根节点
-
-
属性节点
-
所有的属性 比如href
-
-
文本节点
-
所有的文本
-
-
其他
查找节点
目标：能够具备根据节点关系查找目标节点的能力
-
关闭二维码案例
点击关闭按钮，关闭的是二维码的盒子，还要获取erweima盒子
-
思考：
-
关闭按钮 和 erweima是什么关系呢
-
父子关系
-
所以，我们完全可以这样做：
-
点击关闭按钮，直接关闭它的爸爸，就无需获取二维码元素了
-
-
节点关系：针对的找亲戚返回的都是对象
-
父节点
-
子节点
-
兄弟节点
-
父节点查找
-
parentNode属性
-
返回最近一级的父节点 找不到返回为null
子元素.parentNode
兄弟关系查找
-
下一个兄弟节点
nextElementSibling属性 -
上一个兄弟节点
previousElementSibling属性
增加节点
创建节点
-
即创造出一个新的网页元素，再添加到网页内，一般先创建节点，然后插入节点
-
创建元素节点方法
//创造一个新的元素节点
document.createElement('标签名');追加节点
-
要想在界面看到，还得插入到某个元素中
-
插入到父元素的最后一个子元素
//插入到这个父元素的最后
父元素.appendChild('要插入的元素');-
插入到父元素中某个子元素的前面
//插入到某个子元素的前面
父元素.insertBefore(要插入的元素,在哪个元素前面);克隆节点
-
特殊情况下，我们新增节点，按照如下操作：
-
复制一个原有的节点
-
把复制的节点放入到指定的元素内部
-
-
克隆节点
//克隆一个已有的元素节点
元素.cloneNode()cloneNode会克隆出一个跟原标签一样的元素，括号内传入布尔值
-
若为true，则代表克隆时会包含后代节点一起克隆
-
若为false，则代表克隆时不包含后代节点
-
默认为false
扩展知识（childrer）
该元素是返回父元素的子节点
语法
父元素.children[索引号];删除节点
目标：能够具备根据需求删除节点的能力
-
若一个节点在页面中已不需要时，可以删除它
-
在JavaScript原生DOM操作中，要删除元素必须通过父元素删除
-
语法
父元素.removeChild(要删除的元素);-
注：
-
如果不存在父子关系则删除不成功
-
删除节点和隐藏节点（display：none）有区别的：隐藏节点还是存在的，但是删除，则从html中删除节点
-
M端事件
原文地址：https://blog.csdn.net/m0_70534200/article/details/144409253
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！