Math对象:****
Math属性：获取圆周率的值Math.PI
Math的API:
四舍五入取整：Math.round() 只认识小数点后的第一位数字
乘方：Math.pow(底数，幂） ES10 简化：底数**幂
开方：Math.sqrt(num) 只能开方
绝对值：Math.abs(num) 把负值变为正值
最大值和最小值： Math.Max/Min（许多数值） 它不支持数组格式
最大值和最小值： Math.Max/Min.apply（Math，arr） 支持数组
生成随机数：Math.random()：在0~1之间取一个随机的小数
公式：parseInt(Math.random()*(max-min+1)+min)
取自己想要的小数位数：num.toFixed(想要保留的小数位数)
底层原理：function toFixed(num,d){
num*=(10**d);
num=Math.round(num);
num/=(10**d);
return num;
}
Date对象:****
创建日期：
获取当前时间： let now=new Date()
自定义时间：let time=new Date(“yyyy/mm//dd hh:mm:ss”)
复制日期： let end=new .Date(start)
意义：修改日期时，一般都是原日期进行修改。
Date的API：
日期的分量（单位）：年（FullYear）月（Month）日（Date）星期（Day）
时（Hours）分（Minutes）秒（seconds） 毫秒（Milliseconds）
API为：date.get/set 日期分（）
特殊点：其它都有get和set，唯独Day没有set。
日期分量的取值范围：
FullYear 当前的年份
Month 0~11
Date 1~31
Hours 0~23
Minutes 0~59
Seconds 0~59
Day - 0~6；0代表星期天
要对日期进行修改时：
date.set日期分量（data.get日期分量（）+/- n）
得到当前时间的毫秒数：
let nows=new Date().getTime()
把日期转换为字符串:
date.toLocaleString() 具有兼容问题，一般选择自己封装一个函数
function chinese(date) {
var arr = ["日", "一", "二", "三", "四", "五", "六"]
var M = date.getMonth() + 1
M < 10 ? M = "0" + M : M;
var d = date.getDate()
d < 10 ? d = "0" + d : d;
var x = date.getDay()
var h = date.getHours()
h < 10 ? h = "0" + h : h;
on = h < 12 ? "上午" : "下午"
var m = date.getMinutes()
m < 10 ? m = "0" + m : m;
var s = date.getSeconds()
s < 10 ? s = "0" + s : s;
return date.getFullYear() + "年" + M + "月" + d + "日" + " " + "星期" + arr[x] + " " + on + " " + h + ":" + m + ":" + s;
}
BOM对象：****
1. history对象：保存了当前窗口的历史记录（过去的url）
API: history.go(数值) //正值表示前进；负值表示后退；0表示刷新
2. location对象：保存了当前窗口的正在打开的url（现在的url）
url的组成部分：协议、域名、端口号、路由和请求信息组成
API: location="新url" //替换当前窗口，可以后退
location.replace("新url");//替换当前窗口，禁止后退
location.reload(); //刷新
3. window对象:
（1）在BOM 中扮演两个角色:
1. 代替全局对象global：保存着全局变量和全局函数
2. 指代当前窗口本身
（2）属性：获取大小
1.获取浏览器的完整的大小：outerWidth/outerHeight
2.获取浏览器的文档显示区域的大小：innerWidth/innerHeight
3.screen.width/height
（3） API:
open("url","target","width=?,height=?,left=?,top=?") // 打开新窗口
window/newW.close() //关闭窗口
newW.resizeTo(新宽，新高) //改变新窗口的大小
newW.removeTo(新x，新y ) // 改变新窗口的位置
（4）提供三个框：
1. 警告框
语法：alert("警告文字");
2. 输入框
语法：let user=prompt("提示文字")
3. 确认框
语法：let bool=confirm("提示文字"); //返回是一个bool值；
（5）定时器：
周期性定时器：
开启：timer=setInterval(callback,间隔毫秒数);
停止：clearInterval(timer);
一次性定时器：
开启：timer=setTimeout(callback,间隔毫秒数);
停止：clearTimeout(timer);
特殊：两种定时器之间可以相互转换
（6）window的专属事件
1. window.onload事件 -- 加载事件
等待其它所有资源加载完后才执行该事件
2. window.onresize事件 -- 设置大小事件
配合innerWidth可以做媒体查询
3. window.onscroll事件 -- 滚动事件
获取滚动条位置：window.scrollY
获取元素距离页面顶/左边有多远：elem.offsetTop/offsetLeft
（7）本地/客户端存储技术：保存者浏览器里面的数据
分类：
1. cookie：存储大小2kb，操作极其复杂，，最多只能保存30天。（已经淘汰）
2. webStorage：存储的大小由8mb，操作非常简单，永久保存。
（1）sessionStorage - 会话级，只要浏览器一旦关闭，数据就会死亡
（2）localStorage - 本地级，只要不你清空他，他就永远存在。
操作方法：
添加：sessionStorage/localStorage.属性名=”属性值”
读取：sessionStorage/localStorage.属性名
删除：sessionStorage/localStorage.removeItem("属性名"); //只能删除一个
清空：sessionStorage/localStorage.clear() //删除全部
- event（事件对象）
1. 事件周期：从事件发生，到所有事件处理函数执行完毕的全过程；其中会经历三个阶段。
捕获阶段：由外向内，记录着要发生的事件有哪些
目标优先触发阶段：目标元素->当前点击的实际发生事件的元素
冒泡触发阶段：由内向外，依次执行我们之前记录着的要发生的事件
2.获取事件对象
主流：会自动作为事件处理函数的第一个形参传入e
IE：event
兼容：event
作用：
1. 获取鼠标位置
获取鼠标相对于屏幕的坐标：e.screenX/Y
获取鼠标相对于文档显示区域的坐标：e.clientX/Y
获取鼠标相对于网页的坐标：e.pageX/Y
2. 阻止事件冒泡 （多出现在笔试面试中）
主流：e.stopPropation();
IE：e.cancelBubble=true;
兼容：e.cancelBubble=true;
3. 事件委托（利用冒泡）
目标元素：target -- 代表实际触发事件的元素
主流：e.target;
IE：e.srcElement;
兼容：e.srcElement;
4. 获取键码;
语法：e.keyCode
5. 阻止浏览器的默认行为
主流：e.preventDefault();
IE：e.returnValue=false;
兼容：e.returnValue=false;
递归函数：简单来说就是再函数之中再一次调用了函数自己，当数据中所有的元素都执行了，就或结束。
使用：常用于遍历层级不明的数据或DOM
使用步骤：
1. 创建函数
function 函数名（root）{
1.判断root第一层代表的是单个元素还是集合。
2.操作
3.判断有没有下一层，如果有就再次调用此函数，传入实参为自己下一层
}
2. 调用函数 : 函数名（根元素）
算法：采用深度优先算法！先纵向在横向。
递归函数与循环的区别：
递归：优点：简单易用
缺点：性能低
纯循环：优点：几乎不占用内存
缺点：逻辑思维强
操作DOM元素的新方法：****
查找元素的新方法：
let elem=document.querySelector（“任意css选择器”） //找到第一个单个元素
let elems=document.querySelectorAll（“任意css选择器”） //找到静态元素集合 可以使用forEash遍历
let elem=document.getElementsByIDname/classname.tarname() //找到动态集合
动态集合与静态集合的区别：
静态集合：DOM发生变化时，不会再次查找页面元素,提升网页性能，多用于做复杂操作，可以使用forEash遍历。
动态集合：DOM发生变化时，会再次查找页面元素，降低网页性能。不支持forEash遍历。
操作css样式（外部样式和内部样式） 【不推荐使用】
步骤：1.找到DOM页面上你所需要操作样式表
语法：let sheet=document.styleSheets[i];
2.获取样式表中所有的样式规则
语法：let rules=sheet.cssRules;
3.找到你所要操作的样式规则
语法：let rule=rules[i]
4.进行操作
语法：rule.style.css属性名=”属性值”
在js中为DOM创建元素：
步骤：1.创建空标签
语法：let elem=document.createElement("标签名");
2.为空标签设置必要的属性和事件
设置属性：elem.style.CSS属性名=”属性值”
绑定事件：elem.on事件名=function（）{操作}
3.把所创建的元素添加到DOM页面中
父元素.appendChild(elem) //把elem元素添加到父元素的最后面
父元素.insertBefore(elem,已有子元素) //把elem元素添加到已有子元素的前面
父元素.replaceChild(elem,已有子元素) //把已有子元素替换为elem元素
特殊：创建option和图片并上树的简化语法;
创建option：select.add(new Option("innerHTML","value"))
创建图片：let img=new Image（宽，高）
删除属性：elem.removeAttribute("属性名") //多用于删除属性名等于属性值的
elem.属性名=””; //用于常见的属性的删除
删除元素：elem.remove()
绑定事件****
**** 方式：
1. 在HTML页面中书写事件属性
语法：<elem on事件名="函数名(实参)">
2. 在JS中使用事件处理函数属性
语法：elem.on事件名=function(){操作}
3. 在js中使用事件API
主流：elem.addEventListener("事件名",callback);
IE：elem.attachEvent("on事件名",callback);
兼容：
if(elem.addEventListener)
{elem.addEventListener("事件名",callback);}
else{elem.attachEvent("on事件名",callback)}
目前为止所学事件：
onclick //点击事件
onscroll //滚动事件 window的专属事件 （前提：获取滚动条的长度）
onchange // 变化事件 select的专属事件 关键：selectedIndex；当前选项的下标
onsubmit // 提交事件
onmouseover // 鼠标移入事件
onmouseout // 鼠标移出事件
onfocus //获取焦点事件 input 的专属事件
onblur //失去焦点事件 input 的专属事件
onmousemove //鼠标移动事件 多余 e.pageX/Y搭配使用
oncontextmenu //鼠标右键事件
onkeydown //键盘事件 （前提：获取键码）
onkeyup// 键盘事件 松开才会触发 多用于开发比手速的应用
