JS-2（API-DOM）
变量声明：尽量使用const，除非需要修改，复杂数据类型用const因为增删改地址不变，除非覆盖原来的数据
DOM：
DOM对象：浏览器根据html标签生成的js对象
获取DOM对象：
用CSS选择器获取单个DOM元素：const x=document.querySelector('css选择器') （不能漏单引号）返回值为CSS选择器匹配的第一个元素
用CSS选择器获取多个DOM元素：const x=document.querySelectorAll('css选择器') ，返回值为CSS选择器匹配的NodeList对象集合，要遍历集合进行修改样式
操作对象：
获取文本内容：对象.innerText
修改文本内容：对象.innerText = 所赋值
可识别文本标签并修改标签：对象.innerHTML = <>文本</>
修改元素属性：
修改标签元素常用属性：对象.属性 = 赋值
修改元素样式属性：
通过style修改：对象.style.属性 = '属性值'
通过覆盖类名修改：用css改好样式，再在js里对象.className = '类名'
通过追加删除类名修改：
追加：对象.classList.add = '追加的类名'
删除：对象.classList.remove = '删除的类名'
切换：对象.classList.toggle = '相关的类名'
修改表单属性：check = true，disabled = true
复杂属性改驼峰命名法
自定义属性：data-属性名 ，dataset：自定义属性的集合，加.属性名选中其中的属性
定时器-间歇函数：
定义定时器：let 定时器名 = 开启定时器代码
开启定时器：setInterval(函数,间隔时间)或setInterval(函数名,间隔时间)，间隔时间单位为ms
关闭定时器：clearInterval(定时器名)
事件监听：
三要素：事件源、事件类型、事件处理程序
元素对象.addEventListener('事件类型’，执行函数)
事件类型：click（点击）、mouseenter（鼠标经过）、mouseleave（鼠标离开）、focus、blur（失焦）、keydown、keyup、input
事件处理程序：true or false，默认为false
事件对象：
获取事件对象：知道鼠标单击的是哪个位置、键盘按的是哪个键
事件绑定的函数的第一个参数（如事件监听的函数中第一个参数）
常用属性：type（获取当前事件的类型）、clientX/Y（获取光标相对可视窗口坐标(0,0)的位置）、offsetX/Y（获取光标相对当前DOM对象坐标(0,0)的位置）、key（用户按下键盘的值）
环境对象：this，指当前环境，简单函数指向windows
回调函数：将函数A作为参数传给函数B时，称A为回调函数
清除空格：trim() 清除字符串左右空格
事件流：事件完整执行过程中的流动路径，事件流经过的两个阶段——捕获阶段、冒泡阶段
捕获阶段：事件处理程序为True，从父元素一直执行到对应元素
冒泡阶段：事件处理程序为False，从子元素依次向上调用所有父级元素的 同名事件
阻止冒泡：事件对象.stopPropagation() 实际是用于阻止事件的流动传播
解绑事件：
L0：使该事件为nullbtn.onclick = function(){执行内容;btn.onclick = null;}
L2：抽离出函数，分别绑定事件和解绑事件addEventListener or removeEventListener （匿名函数不可用）
阻止默认行为：事件对象.preventDefault()
事件委托：
优点：减少注册次数，提高性能
原理：利用事件冒泡特点
事件对象.target指向事件（点击）对象，if(事件对象.target.tagName=='P')tagName限定有修改的元素标签，P为<p>的tagName，一律为大写
页面加载事件：
window.addEventListener('load',function(){})等待页面完全加载完毕再执行回调函数
document.addEventListener('DOMContentLoaded',function(){})等待页面元素加载完成即可无需等待图片
页面滚动事件：
window.addEventListener('scroll',function(){}) 用于滚动页面时固定元素
scrollLeft、scrollTop：值滚动时卷去部分的大小，该属性可读写
页面尺寸事件：
window.addEventListener('resize',function(){}) 当可视窗口大小有改动时执行
可读取所选容器的宽度和高度（不读取border）：clientWidth clientHeight
可读取所选容器的宽度和高度（读取border）：offsetWidth offsetHeight
可读取元素与定位的父级元素距离：offsetLeft offsetRight ，不可写
可读取所选容器的大小以及与可视距离的距离：.getBoundingClientRect()
获取时间：
const date = new Date()：指定时间则在括号内填上所需时间的字符串
日期对象的方法：
date.toLocaleString()：年/月/日 时间
date.toLocaleDateString()：年/月/日
date.toLocaleTimeString()：时间
多写上定时器才能实时更新
时间戳：
1970.1.1 00:00:00至今的毫秒数
获取方式 ：
date.getTime()：必须实例化，可获取指定时间时间戳
+new Date()：可获取指定时间时间戳
Date.now()：只能获取当前时间的时间戳
查找节点：
子元素.parentNode：找上一级父元素，无则返回null
父元素.childNodes：获取所有子节点（包括文本、换行、注释）
父元素.children：获取所有下一级子元素节点，返回一个伪数组
弟元素.previousElementSibling
兄元素.nextElementSibling
增加节点：
document.creatElement('')；父元素.appendChild(DOM元素) （追加到最后）or 父元素.insertBefore(要插入的元素，插在哪个元素之前)
克隆节点：
对象.cloneNode(true)
删除节点：
父元素.removeChild(删除元素)
删除元素.remove()
插件：
