第一天.txt
BOM常用对象:
1.history对象:保存当前窗口的历史记录
前进:history.go(1);
后退:history.go(-1);
刷新:history.go(0);
2.location对象:
常识:
1.协议:https/http/ftp/ws/
2.主机号IP地址/域名
3.端口号:https默认端口为443，http默认端口为80,只有默认端口可以省略不写。
4.文件的相对路径/路由:百度加密了。
5.查询字符串/请求信息
属性:
协议:location.protocal;
域名:location.hostname;
端口:location.port;
路由:location.pathname;
请求信息:location.search;
跳转:location="新url"
替换当前窗口，可以后退
location.replace("新url")
跳转后，禁止后退
location.reload();刷新
DOM:
1.查找元素
1.通过关系
2.直接找元素
1.document.getElemtByxx();
2.document.querySelector;
2.var elems=document.querySelectorAll("任意选择器");
面试题:document.getxxx和document.queryxxx的区别
1.后者更适合复杂查找
2.动态集合和静态集合的区别
1.动态集合:每一次DOM发生变化，他都会悄悄在此查找，效率低下，不支持forEach
2.静态集合:不会悄悄地再次查找，效率高，支持使用forEach
2.样式表样式:
var sheet=document.stylesheet[i];
var rules=sheet.cssRules;
var rule=rules[i];
console.log(rule.style.css属性名);
rule.style.css属性名="css属性";
3.操作属性:
1.获取属性值:
核心DOM:elem.getAttribute("属性名");
HTML DOM:elem.属性名;
2.设置属性值:
核心DOM:elem.setAttribute("属性名","属性值");
HTML DOM:elem.属性名="属性值";
3.删除属性:设置属性值为空
核心DOM:elem.removeAttibute("属性名");
HTML DOM:elem.属性名="";属性节点删不干净
4.判断有没有，垃圾
核心DOM:elem.hasAttribute("属性名");
HTML DOM:elem.属性名!="";
注意:class必须写为className;
4.操作内容-你是学习完整的:innerHTML/innerText/value;
5.如何创建元素以及上树:三步
1.创建空标签
var elem=document.createElement("空标签")
2.为其设置必要的属性和事件
elem.属性名="属性值";
3.上树:3种
父元素.appendChild(elem);//在父元素末尾处追加一个子元素elem；
父元素.insertBefore(elem,已有子元素);//父元素追加一个子元素，放在已有子元素的前面。
父元素.replaceChild(elem,已有子元素);会替换掉已有子元素。
创建变量:新增的一个let关键字
let 变量名=值;
类数组转为普通数组:接住=Array.from(类数组对象);
第二天.txt
1.递归:
专门用于遍历层级不明确的情况
如何使用:
function 函数名(root){
}
函数名(实际的根)
2.绑定事件:3种方式
1.在HTML上书写事件属性
<elem on事件名="属性名(实参)"></elem>
缺点:
1.不符合内容与样式与行为的分离原则
2.无法动态绑定，一次只能绑定一个元素
3.不支持绑定多个函数对象
2.在js内使用时间处理函数属性
elem.on事件名=function(){操作}
扩展:select&option
select.add(new option("innerHTML","value"))
第三天.txt
获取事件对象event:
主流:会自动作为事件处理函数的第一个形参传入
1.获取鼠标的坐标:
获取鼠标相对于屏幕的坐标:e.screen X/Y
获取鼠标相对于窗口/客户端/文档显示区域的坐标:e.client X/Y
获取鼠标相对于网页的坐标:e.page X/Y
2.阻止事件冒泡:鄙视面试中
主流:e.stoppropagation();
老IE:e.cancelBubble=true;
兼容:e.cancleBubble=true;
3.利用冒泡/事件委托-开发中常用，提升网页性能，有了它我们的事件函数也可以换为箭头函数了。
目标元素:e.target;
老IE:e.srcElement;
兼容:e.srcElement;
4.阻止浏览器的默认行为:比如:e.preventDefault();
老IE:e.returnValue=false;
兼容:e.returnValue=false;
右键事件-window.oncontextmenu;
键盘事件-window.onkeydown;
按住和按下，任何键盘按键都可以触发
window.onkeypress;
按住和按下，只有字母，数字，回车，空格可以触发，其他按键不行
window.onkeyup;
松开，任何键盘按键都可以出发(比手速的游戏)
获取建码:e.keyCode;
可以获取你按了哪个键。
第四天.txt
1、事件的取消绑定
1. 如果使用了elem.onclick=()=>{}，那么elem.onclick=null
2.如果使用elem.addEventListener("事件名",回调函数); 那么：
elem.removeEventListener("事件名",回调函数);
- 事件名和回调函数，必须和添加时的一模一样
this的指向：非常多
单个元素绑定事件this->这个元素
多个元素绑定事件this->当前元素
箭头函数中的this->外部对象
***函数中的this->当前正在调用函数的这个人
定时器的this->window
三个固定套路：
1、Math.max/min.apply(Math,arr) - 也能支持数组参数：
2、Object.prototype.toString.call/apply(x)==="[object Array]";//鄙视题：判断xx是不也是一个数组
3、类数组转为普通数组：
1、接住=Array.prototype.slice.call/apply(类数组对象)
2、接住=Array.from(类数组对象)
解构赋值
1、类似数组的解构赋值
let [a,b,c]=[1,2,3];
console.log(a);
console.log(b);
console.log(c);
2、类似对象的解构赋
let {a,b=默认值,c}={c:3,a:1,b:2};
console.log(a);
console.log(b);
console.log(c);
//形参可以设置默认值，如果自己传入了，就用自己的
3、调用函数时，传递实参的顺序无所谓了
function zwjs({name,age,hobby="女"}){ return 我的名字叫${name},今年${age}岁,喜欢${hobby};
}
console.log(zwjs({hobby:"学习",age:18,name:"袍哥"}));
4、函数的返回的结果，可以有多个
function f1(){ var a=1; var b=2; return [a,b]; } var [a,b]=f1(); console.log(a,b);
第五天.txt
1.正则表达式:定义字符串中字符出现规则的表达式
1.最简单的正则就是关键字原文"no"->/no/后缀 语法:/正则表达式/后缀g(全部)/i(忽略大小写)
2.备选字符集:/^[备选字符集]$/
强调，一个中括号，只管一位字符。 如果备选字符集中的ascii码是连续的，那么可用-省略掉中间部分,比如: 一位数字:[0-9]; 一位字母:[A-Za-z]; 一位数字、一位字母、下划线:[0-9A-Za-z_] 除了数字(很少使用):[^0-9]
3.预定义字符集:
一位数字:\d
一位数字、一位字母、下划线:\w
一位空白字符:\s
4.量词
1.有明确数量:
字符集{n,m}:至少n个，最多m个
字符集{n,}:至少n个，多了不限
字符集{n}:n个
无明确数量:
字符集?:可有可无，最多1个
*:可有可无，多了不限
+:至少一个，多了不限
选择和分组:
（规则1|规则2）
API:
1.切割:var arr=str.split("固定切割符"/RegExp);
2.替换:
基本替换法:str=str.replace(/正则表达式/后缀,"新内容");
高级替换法:str=str.replace(/z正则表达式/)=>(){}
格式化:id.replace(reg,function(a,b,c,d,e,f,g,h)){}
验证:var bool=reg.test("用户输入的");
