第一天：

1、Math：不需要创建的，JS的解释器自动创建，可以直接使用属性：Math.PI

API：
	1、取整：
		1、上取整：Math.ceil(num);
		2、下取整：Math.floor(num);
		3、四舍五入取整：Math.round(num);

		我们以前学的*parseInt()，不光可以取整，还可以将字符串转为数字，并且去掉单位
		*num.toFixed(d);//四舍五入，小数位数有你自己决定，解决浏览器带来的舍入误差，唯一的缺陷就是返回是一个字符串，所以建议搭配上parseFloat使用

	2、*乘方：Math.pow(底数,幂) ===> 底数**幂
	     开方：Math.sqrt(num)

	3、最大值和最小值：Math.max/min(123,26,5,897,0,98,3,42,875)
		支持数组：Math.max/min.apply(Math,arr)

	4、绝对值：Math.abs(-1);

	5、随机数公式：parseInt(Math.random()*(max-min+1)+min);//只要有随机功能，底层一定用到了随机数

	其实还有Math.tan/sin/cos，但是我们绝对用不上

2、Date：日期对象，提供了一些操作创建：构造函数方式 1、*当前时间：var now=new Date();

	2、自定义时间：
		*var birth=new Date("1986/02/21 12:45:45");
		var birth=new Date(1986,1,21,12,45,45);

	3、复制日期：日期所有的API都是修改原日期对象的，导致我无法同时获取修改前和修改后的日期，所以操作API之前都要先复制
		*var end=new Date(start);

	4、可以传入一个毫秒数，也可以创建时间，但是不方便
		var end=new Date(1000);

操作：
	1、两个日期相减，可以得到毫秒差，换算出自己想要的部分 - 倒计时
	2、分量：FullYear Month Date Day Hours Minutes Seconds Milliseconds
		每一个分量都有一对儿getXXX/setXXX，唯独Day没有set
		如果你希望对某个分量做加减操作：
			date.setDate(date.setDate()+/-n)
	3、格式化日期为本地时间：date.toLocaleString();//虽然这个方法不好，具有兼容性问题，但是我们可以自己封装一个格式化方法
		而且转为字符串，其实并不是坏事：得到了所有字符串的API

第二天：

1、BOM：Browser Object Model：浏览器对象模型，专门用于操作浏览器的，但是老IE和其他浏览器的标准不同，导致在BOM的学习中可能会遇到很多的兼容性问题

2、window对象： 1、充当全局作用域 2、指代当前窗口本身属性： 1、获取浏览器的完整大小：outerWidth/Height; 2、获取浏览器的文档显示区域大小：innerWidth/Height; 3、屏幕大小：screen.width/height

	API：
	1、打开新窗口：var newW=open("url","target/自定义","width=?,height=?,left=?,top=?");
		如果写了第三个参数，小窗口会脱离浏览器独立存在，也可以改变大小和位置
	2、关闭窗口：window/newW.close();
	3、改变新窗口的大小：newW.resizeTo(新宽,新高);
	4、改变新窗口的位置：newW.moveTo(新x,新y);
	5、提供了3个弹出框：
		警告框：alert();
		输入框：var user=prompt();
		确认框：var bool=comfirm();
	6、专属事件：
		1、onload - 只要把js代码放到html的后面，此事件可以不使用
		2、onresize - 只要浏览器的大小发生了变化就会触发，搭配上innerWidth就可以做出JS版本的CSS媒体查询
		3、onscroll - 只要滚动条一旦滚动就会触发
			1、获取滚动到哪里：scrollY
			2、获取某个元素距离页面顶部/左侧有多远：elem.offsetTop/Left;
			3、搭配上ajax可以越往下滚，东西越多
	7、定时器也是属于window的
	8、本地/客户端存储技术：
		webStorage：sessionStorage（会话级：一旦关闭浏览器，数据就会死亡）和localStorage（本地级：永久存在的）
		如何使用：
			添加：xxxStorage.属性名=属性值;
			读取：xxxStorage.属性名
			删除：xxxStorage.removeItem("属性名");
			清空：xxxStorage.clear();

a标签的其他用途： 1、跳转 2、锚点： 3、下载： 4、打开图片和记事本： 5、直接书写JS：

第三天：

1、BOM：两个对象： 1、history：保存着当前窗口的历史记录（过去的url）前进：history.go(正数) 后退：history.go(负数) 刷新：history.go(0);

2、location：保存着当前窗口的正在打开的url（现在的url）
	属性：
		协议：location.protocal; - https/http/ftp/ws...
		域名：location.hostname; - 主机号|IP地址，不方便记忆，域名是要花钱购买的
		端口号：location.port - https(443)/http(80);
		路由：location.pathname - 文件相对路径
		请求消息：location.search - form（GET）表单提交后带来的

	常识：一个url总共有5部分组成：协议://域名:端口号/路由?请求消息

	作用：
		跳转：location="新url"
		跳转后禁止后退：location.replace("新url") - 替换当前url是不产生历史记录的
		刷新：location.reload();

2、DOM：补全了！增、删、改、查（元素、内容、属性、样式）

1、元素：
	增：3步
		1、var elem=document.createElement("标签名")
		2、elem.属性名="属性值"
		      elem.on事件名=function(){}
		3、父元素.appendChild(elem);
		      父元素.insertBefore(elem,已有子元素);
		      
	删：elem.remove();

	改：父元素.replaceChild(elem,已有子元素);

	查：2大类：
		1、直接找：2类：
			1、var elems=document/父元素.getElementsByTag/ClassName("标签/class名");//动态集合HTMLCollection，效率低下，而且不支持forEach
			2、var elems=document.querySelectorAll("任意css选择器");//复杂查找，静态集合NodeList，效率高，而且支持forEach
		
		2、关系：

2、内容：innerHTML/innerText/value
	增：elem.属性名+="新内容"

	删：elem.属性名=""

	改：elem.属性名="新内容"

	查：elem.属性名

3、属性：HTML DOM：class必须写为className 而且只能操作标准属性，不能操作自定义属性
	增：elem.setAttribute("属性名","属性值");	===	elem.属性名="属性值"

	删：elem.removeAttribute("属性名");		===	elem.属性名=""

	改：elem.setAttribute("class","d1 d2");		===	elem.属性名="属性值"

	查：elem.getAttribute("属性名");		===	elem.属性名;

4、样式：内联样式
	增：elem.style.css属性名="css属性值";

	删：elem.style.css属性名="";

	改：elem.style.css属性名="css属性值";

	查：elem.style.css属性名;

第四天：

1、递归：函数内再次调用了函数自己，但迟早有一天会停下来何时：专门用于遍历层级不明确的DOM或数据如何： function 函数名(形参){ 1、第一层要做什么直接走

		2、判断有没有下一层，如果有再次调用此方法，只不过传入的实参是自己的下一层
	}
	函数名(实际的根元素/根数据)

缺点：同时开启大量的函数调用，消耗内存

2、绑定事件的新方式：主流：elem.addEventListener("事件名",callback); 老IE：elem.attachEvent("on事件名",callback); 兼容： if(elem.addEventListener){ elem.addEventListener("事件名",callback); }else{ elem.attachEvent("on事件名",callback); }

第五天：

属于BOM的重点只有3个：定时器 + 客户端存储技术 + event（事件对象）：

1、事件周期：从事件发生，到所有事件处理函数执行完毕的全过程： 3个阶段： 1、捕获阶段：由外向内，记录着要发生的事件有哪些 2、目标优先触发：目标元素->当前点击的实际发生事件的元素 3、冒泡触发：由内向外，依次执行我们之前记录着的要发生的事件

2、*****获取事件对象event：主流：会自动作为事件处理函数的第一个形参传入e 老IE：event; - 老IE全局有这个变量兼容：event;//第一次见到小三上位，不光老IE可用，主流也可用

得到了事件对象event可以做什么呢？
	1、***获取鼠标的坐标/位置
		获取鼠标相对于屏幕的坐标：e.screenX/Y
		获取鼠标相对于浏览器窗口/客户端/文档显示区域的坐标：e.clientX/Y
		获取鼠标相对于网页的坐标：e.pageX/Y

	2、***阻止事件冒泡 - 笔试面试中
		主流：e.stopPropagation();
		老IE：e.cancelBubble=true; 
		兼容：e.cancelBubble=true; //第2次见到小三上位，不光老IE可用，主流也可用

		非常想把事件处理函数简化为箭头函数，但是简化后，this就用不了了，需要一个人来代替this（当前元素 - 水性杨花），this其实不是什么好东西，他的指向非常的多
	3、*****事件委托/利用事件冒泡 - 开发中常用：提升网页性能，有了它我们的事件函数也可以简化为箭头函数了
		优化：如果多个子元素定义了相同 或 相似的事件操作，那么最好只给【父元素定义一次】
		为什么：每一次绑定一个事件函数，其实都是创建了一个事件对象，创建的对象越多，网页的性能就越差
		淘汰了this，他水性杨花，当前元素
		认识一个【目标元素】target：实际触发事件的元素
		主流：e.target;
		老IE：e.srcElement;
		兼容：e.srcElement;//第3次见到小三上位，不光老IE可用，主流也可用

	4、***组织浏览器的默认行为：比如：a标签默认就可以跳转，提交按钮可以提交表单，右键自带一个弹出框，F12自带一个控制台，F5自带刷新，F11自带全屏...
		主流：e.preventDefault();
		老IE：e.returnValue=false;
		兼容：e.returnValue=false;//第4次见到小三上位，不光老IE可用，主流也可用
	
		新事件：
			1、右键事件 - window.oncontextmenu
			2、键盘事件：一般用于游戏开发比较多 + 都要搭配上键盘的键码
				*window.onkeydown - 按下和按住都会触发，任何键盘按键都可以触发
				window.onkeypress - 按下和按住都会触发，但是只有数字、字母、回车、空格可以触发，其他人不行
				window.onkeyup - 松开按键才会触发，任何键盘按键都可以触发

	5、***获取键盘的键码 - 因为我们不做游戏开发
		e.keyCode; - 可以获取到你按了哪个键，每个键都有自己对应的键码，但是不需要记忆，要么输出看，要么百度搜个表

	event可以说是BOM之中最最最重要的一个点！

脱字符串衣服：eval(str) - 会悄悄的脱掉字符串的衣服再运算如何判断目标元素是什么标签：xx.nodeName - 得到的标签名是全大写组成的

6、开关门+选项卡 - 事件委托版
7、淡入淡出轮播 - 事件委托版
8、购物车 - 事件委托版
9、尝试event的其他功能（阻止浏览器的默认行为、阻止冒泡、获取键盘键码）
10、阻止浏览器的右键弹出框，弹出一个属于你自己写的框框

第三周知识梳理

第一天：

第二天：

第三天：

第四天：

第五天：