html4.0/css2.0:
1.常见标签：
(1).table表格
(2).a标签以及title属性
(3).border属性 [简写属性：包含了所有border；复合属性：包含很多属性]
(4).ul/ol标签
(5).url、href、src、alt、title的区别;以及 link标签和@import引入css文件的区别
(6).form表单 (checked可用于type为radio/checkbox; selected/multiple只能用于下拉多选框)
<select name="" id="" size="5">;//size属性表示 -> 下拉列表的数目(即option的个数);
(7).bfc模式：html聚焦点便是把每个标签都当作盒子，每个盒子都遵循规则来渲染，bfc模式中采取独立的渲染规则来渲染，触发其的条件有很多，常用的有四种：position/float;display:inline-block; overflow:hidden/auto；应用场景：清除浮动以及解决margin坍塌(让元素位于触发bfc模式的标签下即可,加父级)
补充：position:absolute;float:left/right;这两个语句出现其一，元素的display属性值就变为inline-block;(当然display:none的方式除外)，系统内部默认进行转化，底层原理为bfc模式；
2.常用知识点：
默认样式：body默认margin:8px; ul默认margin-top/bottom:16px; li前的type类型默认padding:40px;
(1).凡是有inline属性的元素都是文本类元素(和文字一样)，编辑器中加空格/回车会分隔开(这里的空格称之为文本分隔符，多少个都认为是一个)，其也是解决多张图片margin的bug底层依据；
(2).基于文档流的网页布局模型：从左到右、从上到下的进行布局(快元素独占一行，行元素不独占一行)，全局下(父元素为body)，快元素若不设置宽/高，默认宽为100%，高取决于子元素；嵌套盒子中，父盒子若设置了宽/高，子元素不设置宽/高，其就默认等同于父元素100%，子元素若设置宽/高大于父元素，其会溢出；
(3).margin的正确理解：margin: 0 auto; 设置元素水平居中(自适应)，应用场景广泛：导航栏;(某一个单独的页面中的div,margin-left/right若是同时使用，实际取值中只能兼顾一边)
width/height: 设置100%，与不设置是有区别的，理解：块元素想象成水一样，不设置宽高的时候，铺满整个盒子，此时设置margin就等同于是两根柱子；若是设置成100%，其的宽高就和外面的盒子有一样的宽高；[无论不设置宽高or宽100%，div中必须有内容，涉及到文档流知识，div设置宽高后，若是内容太大，会溢出盒子，若div不设置宽高/宽100%，宽高随着里面的内容变化，没有内容，压根就看不到盒子] 【width 100%或者不设置宽高，铺满屏幕但是会有body的margin，不完成铺满，但是vw视口宽度相对单位忽略body的margin】
【三栏布局：中间的div必然不能设置宽度:100%;设置了以margin-left为主，不是想要的结果】
补充：div如何设置铺满整个屏幕：
[1].<div style="background-color:red">></div>,不设置宽高，这样肯定不可以，前面提到的“铺满整个盒子”只是概念而已，其还是遵循文档流的，宽度铺满，高度等于内容的高度；
[2].<div style="width:100%;height:100%;background-color:red"><</div> 这样设置没效果的，实际上100%是相对单位，需要给body设置，[如果有多个div，需要每一层都去设置才可以]; 这时候宽度写不写都OK的 [前面聚焦点是“width”,无论两种情况中的哪种都是水平“铺满”效果，现在探讨height就OK]；
<div style="height: 100vh; background: #000;"><</div> 直接使用vh视口高度相对单位也是OK的，更简便；
(4).常用属性： text-align:center/left/right; vertical-align:top/middle/bottm/-1,0,1;(元素的垂直对齐方式); text-indent:2em;(1em= 1 * font-size);text-decoration:underline/none/overline/line-through; cursor:pointer/help/e-resize;
单行文本居中:text-align,line-height; 快元素居中:设置margin,fixed固定定位；
line-height:行高，font-size:16px(16px指的便是字体高度)；line-height默认等于1.2em;//不同浏览器不同；
vertical-align: 垂直对齐属性，值可以是top/middle/bottom; 数字和%; img{vertical-align:text-top} 可以让图片和文字顶部对齐；(应用场景目前遇到不多，但也遇到过不起作用的，其还是很复杂的)
补充：行内块元素外面若有文本类元素，例如文字，聚焦点是“文字”，正常情况：底部对齐，但若是行内块元素内有文字，外面的文字会和里面的文字底部对齐，当内容中个的文字变大或缩小，外面的文字依旧是底部对齐；[快元素不讨论，牢记此种情况即可：块元素浮动起来，可制作环绕布局]
(5).伪元素：任何一个元素都含有，::before; ::after; 伪元素可以被css进行样式的改变，它和普通元素一样，只是不显示到html结构中而已(控制台也可查看)；::after{content:''"; display:inline-block;};其是行元素，操作时往往转化为快级元素；[使用场景还是很广泛的，例如清除浮动][清除浮动的四种方式：1.浮动元素后加快级元素,clear:both;2.父元素增加触发bfc模式的条件；3.父元素利用伪元素清除；clear:both必须在快级元素中才起作用] [伪元素可写：,系统可识别自动补充为：：]
window.getComputedStyle(div,"after").width;//通过window对象上的计算样式方法来获取伪元素属性
(6).background-image:url();括号内直接写路径无引号(如今有无引号皆可)；使用背景图片或者使用img图片略有区别，查看html小结中淘宝小demo;[平时设置的背景图片、背景颜色是包含padding的,但绝不会包含border] [img中的alt属性功能：1.图片未能成功加载时的提示文字；2.网页爬虫爬取图片的根据之一] [前后端传输数据中的图片地址并不是我们学习过程中所写的本机图片存储的路径，而是网络地址，图片也是部署到服务器中的]
(7).单行文本超出打点展示：三件套<div style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;"">内容区</div>；多行文本直接截断处理overflow:hidden;，css3也有相关技术解决方案，但其针对的是移动端，移动端浏览器基本都是08年以后的浏览器；
(8).css引入html方式：外联，嵌入<style></style>，行内(内联)样式；
(9).form是快元素，表单元素都是行内快元素，表单元素(表单控件)都有value特性；
<input type="text">输入框，value是值,默认也是提示信息，placeholder是html5提供的提示信息属性，更专业一些，value表示的是用户输入的数据 [都设置时vlaue起作用]；日常开发常操作padding-top/bottom来控制宽高，而且还不影响输入框的宽高，padding-left：调节距离左边；
(10).css可继承属性： css关键字inherit，子元素不设置便继承父元素的属性/属性值font-size: inherit; p{color:inherit};
[1].字体相关: line-height,font-family/size/style/variant/weight,font; [2].文本相关:letter-spacing(字母间距);word-spacing(字间距);text-align/indent/transform,; [3].列表相关:list-style-image,list-style-position,list-style-type,list-style;[4].color
(11).html中的每个标签都是对象；http://www.w3school.com.cn/jsref/dom_obj_anchor.asp；浏览器中的控制台不仅仅可以输出js相关的错误信息，也可以输出html、css的一些语法错误提示信息，例如图片路径问题；
(12).display的属性值：none/inline/inline-block/block,以及后续还有很多dispaly:table/flex/grid; [display:none; 元素使用该属性会消失(html结构依旧存在)，快元素/行元素/行内快元素都可以使用该属性，这种消失是不会占用原来位置的；overflow:hidden;超出部分隐藏，隐藏的部分也不会占用原来位置，相比来说只有position:relative;其是占用原来位置的]；
(13).position:static;/fixed;/relative;/absolute;/inherit;/sticky; (z-index很常用，其只能同定位属性使用)
static:无定位(默认值)，其遵循文档流(从上到下，从左到右的元素排列，快元素独占一行，行元素水平排列); fixed:固定定位，相对于浏览器窗口/视口; relative:相对于自身进行定位(其会保留原有位置);absolute:相对于有定位属性的父元素进行定位，若没有则相对于body进行定位; inherit:继承父元素的position属性，IE8及之前都不支持inherit属性; sticky: 较复杂；https://www.cnblogs.com/s1nker/p/4835079.html
补充1：屏幕； 屏幕除掉任务栏->屏幕可用区；浏览器窗口==视口==可视区窗口==body所展示的内容，整个body/html页面很大;(技术人员所谈到浏览器大小指的便是窗口大小，窗口不包含工具栏，滚动条，以及不包含打开的控制台) [fixed定位是相对于视口(body展示内容定位的)，absolute相对于有定位属性的父元素，若是没有，则相对于body]
ie6没有固定定位，可用absolute绝对定位来进行模拟实现
补充2：position:absolute;left:0;top:0;//若不写left/top其的默认值为auto，开发中若是用到需设置为0px,否则会报错(涉及到物体运动会出错)；
(14).三栏布局中的圣杯布局/双飞翼布局
(15).常用的html编码：< -> "<"; > -> ">"; ×表示的是叉号"x"; padding: 填充/内边距；
(16).关于<meta>标签，网址：https://blog.csdn.net/yimuqing123/article/details/53012549
(17). position新增属性sticky ->粘性定位 ->其是相对定位和固定定位的混合，元素在跨越特定阈值前为相对定位，之后为固定定位；须指定 top, right, bottom 或 left 四个阈值其中之一，才可使粘性定位生效，否则其行为与相对定位相同；
(18).居中也不常使用text-align;line-height ->行元素、快元素大多使用padding夹；
(19).CSS:层叠样式表 -> 所谓层叠：就是权重一样的css样式会出现覆盖；
(20).
(21).
IE独有属性Zoom: 参考网址：https://www.cnblogs.com/java-zone/articles/2733991.html
ECMAScript:
(1).定义变量=变量声明+变量初始化(赋值)； var a;//变量声明;a=10;//变量初始化;var a=10;//定义变量; function test(){};//函数声明;定义函数有多种方式:函数声明，函数表达式，new Function(); 对象中使用的称为方法，匿名函数/es6箭头函数(一般作为回调函数以及函数参数使用)；(只要能弄出来函数都称为定义函数)
日常开发中变量声明/定义变量的简写形式：var a, b, c,; var a=10,b,c=20;
(2).undefined:console.log(window.a);//undefined,或者对象.某属性(没有该属性);//undefined; 数组中也有此种情况，js是很"宽容"的语言，一般情况下不会报错；console.log(a);// a is not defined; 压根并不存在某变量却直接使用，其会报错；[唯一未声明还不报错的情况 typeof(a);//"undefined"]
(3).类型转换：聚焦点是原始值之间的类型转换(显式/隐式)；parseInt();/parseFloat(); 聚焦把字符串转换为数字类型，toString(); 聚焦点为把布尔值或数字类型转换为字符串；[实际引用值也可以进行隐式类型转换，不过没什么应用场景(没用处)，Number( [] );// 0; Number( [] -1);//-1;] [对于引用值知道[] ==[] //false; [] === []//false;就可以啦；此外还有一点，有些判断的时候就是没有显/隐式类型转换，系统就那么定义的，undefined == null//true; undefined > 0//false;undefined<0//false; undefined=0//false; 如果遵循比较运算符的隐式类型转换，Number(undefined)//NaN; Number(null)//0;]
(4).补充三目运算符：xxx = 条件判断?A：B；//其在某些情况下可替换if条件判断语句，实现代码优化，其可以直接返回结果，而if条件判断语句若要返回值则必须写语句return~ , document.write(); alert();等；[经典案例：var num = 1>0 ? ("10" > "9" ? 1:0) :2; //0 先执行括号内，比较运算符都是字符串时，逐位ASCII码进行比较]
(5).
(6).现象下的底层逻辑：
[1].if条件判断中的&& || “全真才为真，一假即为假”等现象：底层逻辑是&& || 运算符的判断规则；[2].变量声明提升/函数声明整体提升：底层逻辑是预编译；[3].关于访问变量的问题，里面的可访问外面的，外面的却不能访问里面的：底层逻辑是函数的作用域；[4].嵌套函数中，外层函数执行结束后，里层函数依旧存活，生命周期比外层函数还长：底层逻辑是形成了闭包；[5].为什么普通的函数执行+new操作符便可以创建对象以及为何使用this：底层逻辑是new操作符以及构造函数隐式三段论；[6].function test(){} ();//报错；test();//不报错：底层逻辑是立即执行函数的底层原理，只有表达式才能被执行符号执行，test就是表达式；[7].str.toString(); 字符串是原始值，为何可调用方法而且不报错有返回值：底层逻辑是其隐式调用了包装类；[8].<div id="" class="" data=""></div>，获取到dom元素后，id/class可打点调用，data却不能进行打点调用，底层原理便是特性和属性的区别，特性有映射关系，属性并没有；
(7).隐式调用方法：
[1].document.write(123);//隐式调用的toString()方法(obj调用的是Object.prototype,其他重写的调用重写的方法)；[2].test(); 系统内部隐式调用的是test.call(); [3].obj.name隐式调用的是obj[];[]内必须是字符串；
(8). [1].javaScript中提到“一切皆对象”，其更侧重思想，抽象去理解；(毕竟undefined/null肯定不是对象(没有属性和方法，不能调用toString();)； [2].对象都有属性和方法，聚焦点是对象操作的时候,test.name; test.eat(); 而真实情况是方法名为属性名，方法体为属性值；
(9). js计算精度问题：[测试：console.log(0.14*100)]；
toFixed(num);//小数点后保留num位数字(四舍五入)，num范围0~20,不写默认为0; js精度不是很准确，尽量避免使用toFixed()方法，计算过程中多使用Math.ceil(); Math.floor();较好；
(10).系统识别问题(bug)：
[1].123.toString();//报错；var num=123; num.toString();//不报错；系统首先会识别为浮点数，小数点后不能是字母，所以会报错；系统不能识别其为方法的调用； [2]. { }.constructor;//报错； [ ].constructor;//不报错；var obj = { }; obj.constructor;//不报错,系统识别问题，其不能识别 { }为对象; [3].关于逗号操作符：其会返回逗号后面的那个数；var num = 1,2; //报错；var num = (1,2);//2; 必须加括号，系统会识别为变量声明，所以会报错；
(11). 性能问题：
[1].使用for循环 / 封装函数的目的就是代码复用，节省代码(减少代码冗余),性能必然会有所提升，但代码篇幅少，编程效率高，不一定性能就会提升；例如:[1].递归，使用递归的缺点就是其运行的慢，但其代码篇幅少简洁；[2].构造函数中使用call();/apply();通过改变this指向灵活使用别人的构造函数构造自己的对象(该方法在构造函数中的使用)，这样做虽然代码篇幅少、编程效率高，但性能不是很好，因为其每次都会多执行函数；
[2].对象调用属性名的两种方式：obj.name/obj['name'];//打点调用的方式需要遍历对象的所有属性查找某属性，耗费性能；
[3].开发中涉及arr.length;以及this很多时候都赋值给变量，其也是减少查找次数，提升性能；
(12). 小知识：
[1].console.log(obj.name);//xiaohua; 而不是"xiaohua"; xiaohua本就表示的是字符串，例如控制台输出str//字符串;123//数字; true//布尔值;[理解即可,明白所指向是何即可，不用死扣];若是此时name:"123";//打印出来的必然是"123"; parseInt(100px);//报错，系统认为其是变量，必须为字符串"100px" [2].对象中不能使用分号(即使是最后一个属性);不同对象直接使用逗号分隔，最后一个对象加不加分号都OK；[记住：对象中别使用分号就OK了] [3].new test();//按照当初所学:this为{}; 这里返回值为test {}; 原因：前面是构造函数的名，后面才是this指向的{};]
(13).关于call();/apply(); 函数都有该方法，调用的时候是函数名进行调用并且改变this指向；Object.prototype.toString.call(); 而非Object.prototype.toString().call();//报错；test.call(); 里面的this指向window对象，test.call(123);//Number {123} 包装类对象；
(14).function/var/break等等这些都是关键字/保留字，平时自己命名的名字都是标识符，需要遵循标识符的命名规则，变量名/属性名/方法名 -> 小驼峰；构造函数名 -> 大驼峰，事件名大多都是小写(直接写就OK，特殊：DOMContentLoaded是document上的事件)，规定它们是大驼峰/小驼峰命名形式是开发规范，并不是语法标准(不遵循也可以正常运行)；javaScript是严格区分大小写的，其聚焦点是命名好名字后不能随便进行更改，例如var testDemo; 使用过程中其是不允许写成TestDEMO,testdemo,tEstDemo等；
(15).关于数组、类数组：
[1].[,,,].length;//3(chrome)，不同浏览器返回不同的结果，主要看能不能识别最后一个逗号；
[2].数组中只有es3.0中的push();/pop();/unshift();/shift();/sort();/reverse();/splice();7个方法会改变原数组，其他方法都不会改变原数组； -> 聚焦点不同，其它方法大多都返回新数组或布尔值；但由于数组是引用值，数组的方法使用过程中若涉及到了数组的元素(引用)的操作，其是会改变原数组中的元素的，所以很多时候如果涉及到数组的元素操作，都会进行“深度克隆”；(以上这种也会改变原数组，开发中要规避，但从本质上探讨数组方法，能改变原数组的方法只有那7个而已)
arr.slice();//不写参数，其会截取所有数组元素 -> 返回新数组; ->等同于克隆了数组
[3].类数组的形式就是对象，区别于对象的是其有索引属性和length属性，最好有push()方法，如果有了splice();方法,其在控制台上表现形式便是数组形式，但其不同于数组，其没有数组的方法，需要用到的方法都是手动添加数组原生的方法；(可理解为类数组是一类特殊的对象)
[4].类数组转化为数组的方法：Array.prototype.slice.call(arguments,0);[].slice.call(arguments,0);//两种方法都可以，建议使用第一种，[]底层隐式调用的也是new Array();//原型链指向Array.prototype;两种方法的聚焦点：Array.prototype.slice.call(); -> 返回值是新数组 -> 之后便可调用数组的属性和方法
[5].二维数组：(写成矩阵的方式便于理解)
(16).静态类、动态类、单例对象
Math JSON都是静态类(全局上的类)，使用过程中直接使用其上的属性和方法即可，new Date(); new RegExp();//日期对象，正则对象使用的过程中new出对象，然后调用其上的属性和方法，称为动态类；window使用的过程中也是直接使用其上的属性和方法即可(window可省略)，不能手动new Window(); 有的构造函数只能由系统进行new对象，称作为单例对象；[这些对象都是js内置对象]
[1].json：数据传输过程中是字符串形式(可识别二进制的文本格式，对象不能直接识别)，传输的数据是json格式，严格来说传输的必须是json对象，开发中传输数组的情况也很常见，(xml需要传输标签，其占用带宽多，传输速度慢)；JSON.parse(); JSON.stringify();[属性名必须加双引号，属性值就是数据类型，number/boolean等自然就不用加双引号了，加上成字符串数据类型了]
[2].Math类：
[3].关于String对象的API，如果返回字符串则必然返回新字符串(原始值确认后便不能再更改)；
var str = "hello js"; str.length;//10,每个空格都是字符，后期涉及到索引，长度等都需要考虑空格；str.substr(index,length); str.substring(index,stop);//stop-index=length;//两个方法都是从index字符截取length个字符，返回新字符串；(方法名都是小写)
str.indexOf();/str.lastIndexOf();//每个字符的索引都是唯一的，这两个方法聚焦点是某字符串中有重复字符出现，通过正向/反向检索来方便"定位"而已，错误方法:str.lastIndexOf('o');//0
str.fromCharCode(e.charCode);//键盘类事件中，传入按键的ASCII，返回按键的字符，监听用户
- - - >>>补充：对象里的方法分为动态的和静态的，动态的方法必须通过实例化后才能使用，而静态的则可以直接使用；Date操作日期对象，明显是动态的，Math则是静态对象；如何区分动态和静态：区分是否会变，日期每分每秒都在改变，但从Math的系列方法来看，自从规定后便没有变过，其就是静态的
[window:单例对象]
关于Arguments:其是对象(类数组),使用arguments也可以，其只能在函数内部中使用，不能在控制台里面直接打印出来；
(17).this指向问题：全局/AO/GO中this指向window(举例window对象上的方法，例如定时器); 方法谁调用this指向谁; new Test();//this指向this{}对象; call();/apply();/bind();改变this指向; 事件中谁触发this指向谁(事件源对象),但IE中div.attachEvent中的this指向window,封装过程中需要改变this指向；
(18).eval();/setInterval();//参数可以是字符串，其可以把字符串当代码执行；
(19).算法：js中最多使用两层for循环，再多的话对性能影响太大； 数组排序：冒泡和快排，快排相比于冒泡少了一层for循环，所以性能更好，并不是代码上简便多少，涉及时间复杂度；快排的时间复杂度比冒泡低；
(20).console.log();//等同于在html中所有代码后写入一个<script>标签并执行该标签 console.log(typeof(num) + ":" + num);
(21).<script>标签的type类型不同有不同的含义： <script type="text/template"></script>;//用于定义模板(模板容器),不解析(渲染/执行); <script type="text/tpl"></script>;//标识不解析该script标签，可以当作库存来使用；
(22).下式很有迷惑性，return作用：结束函数并返回值(不写默认返回undefined)
(23).关于删除：dom树中涉及节点删除使用parent.removChild();/ele.remove(); 原型/原型链以及对象删除属性/方法中,delete obj.name;
(24).function test(){};//test为函数名，函数体为fuction test(){}/function (){}; 预编译过程中以及对象中的方法存在的形式都是这两种，不用死扣；至于函数引用，其指向的是函数体(输出函数应用直接输出函数体即可)，应用场景：arguments.callee;//func.caller;
(25).关于数据类型(也称为值类型)：笼统来分：基本数据类型中有5种，引用数据类型中只有Object,其中的Array,Function,date,RegExp等都属于Object; //typeof(); 方法可以返回6个值,引用数据类型中其可以返回"function", -> 封装更精准的库函数type();
(26). 定时器是异步执行的底层原因：执行定时器函数的是新线程，for循环是主线程执行，其先执行for循环，然后将定时器加入到该队列中，所以就会形成闭包的现象；
(27).try{}catch(){};//若不使用其，代码出错便是未捕获到的错误 -> Uncaught ReferenceError: fn is not defined
(28).关于date日期对象： date.getHours();//获取值； date.setMinutes(17);//设置分钟数； date.getDate();//获取对象中月的某一天 (1~31); date.setDate();//设置对象中月的某一天 (1~31); date.getDay();//获取对象中周的某一天(0~6); date.setDay();//设置
var date = new Date();//创建对象；[表示的是这一刻的时间]；记录时刻，测试：date.getSeconds(); 始终都不变； ->其也可获取已知时间的xx：new Date(2020,3,15).getDate();
DOM/BOM：
(1).DOM/BOM的理解：DOM是通过js来操作xml/html，间接操作css样式，首先利用document对象上的系列方法来操作dom元素，获取到的是标签对象<div></div>,之后利用元素的系列方法来操作样式以及进行事件的绑定，聚焦点是样式的改变+行为处理；BOM是通过js来操作浏览器，实际就是操作浏览器窗口，而window表示的便是窗口，所以BOM就是操作window对象上的系列属性和方法，其下有很多属性和方法，可以归为一些类，类如document/navigator/history/location/screen; DOM/BOM 两者都可以理解为是系列方法的集合； html标签->对象->调用属性和方法，这就体现了js的面向对象编程的思想；
(2).html/css遵循的w3c标准，ECMAScript标准是ECMA组织制定的关于javaScript的一系列标准，该标准最初只是关于jsvaScript,后期又补充了DOM/BOM标准(准确说：由于DOM是操作html标签的，所以是w3c标准制定的DOM，BOM没有很明确的标准)，但留有接口，其是由各个浏览器厂商来补充方法，也就是DOM/BOM是该组织和浏览器厂商共同来完善的，由于是各个浏览器厂商参与补充完善，不同浏览器会根据自己浏览器进行设置，所以DOM/BOM才会出现兼容性问题，DOM是通过javascript来操作html的，BOM是通过javascript来操作浏览器的，DOM上兼容性差异还不是很大(主要是IE，由于IE9以下都不遵循w3c标准)，但是BOM各个浏览器几乎都不相同(浏览器厂商几乎不开放权限)；
- - - - - > 原生js中兼容性问题都出现在DOM/BOM中(BOM开发中很少涉及)，针对DOM(主要是IE9以下)需要封装处理兼容性问题的脚本库(window系列方法和事件等等)
(3).关于IE浏览器的兼容性问题：Microsoft现在已经放弃IE品牌，目前只维护IE11和Edge浏览器版本，其他版本放弃维护；但由于之前IE浏览器市场份额过大，目前网站开发中还是需要兼容IE浏览器，IE中的兼容性：IE9以上几乎和其他浏览器一样都遵循w3c标准，IE9部分支持，IE9以下由于IE前期不遵循w3c标准，兼容性问题较多，IE有自己的一套标准来实现同样的功能；[兼容性问题主要是DOM部分，DOM是一系列方法的集合通过js来操作html，所以这就涉及到w3c标准] [后期提到的IE浏览器兼容性问题：一般指的便是ie8及以下，ie6的兼容性基本也不处理了，主要是ie8]
- - - >>> DOM兼容性问题主要是IE，其他浏览器也有，例如元素节点的属性innerText,火狐没有该属性，其使用textContent代替；事件源对象中IE支持event.srcElement, 火狐支持event.target；chrome两者都有；等等(ie6及以前没有fixed定位/设置盒子的margin-left/right不会居中，这些都是之后的功能)
(4).关于网页标准渲染模式、怪异(混杂)渲染模式：浏览器有很多迭代版本，版本发布的时候内部便确认了使用的es版本(js引擎进行解析js代码)，网站开发中是根据es标准开发适合在浏览器运行，但浏览器版本迭代速度较快，之前在旧版本运行的网站便需要进行重构来适应新版本浏览器，为了节约成本，便诞生了怪异渲染模式；其解决的问题：处于怪异渲染模式下的浏览器可以正常渲染之前的网页，浏览器向后兼容；[不同的浏览器都有兼容性问题，IE浏览器兼容性最差，不过这里谈到的两种渲染模式以及提到的兼容性问题，并不是有很多的问题，只不过是那么几个而已,等同于实现相同的功能有自己独特的方法] [每个浏览器怪异模式支持的区间不同，chrome浏览器支持区间是5个版本，IE6浏览器支持的是IE5和IE4]
- - - >>>关于渲染模式：[1].判断网页目前处于何种渲染模式，[2].怪异模式下的盒子模型和标准渲染模式下的区别(只有ie6浏览器有怪异模式盒子)：width/height = content+padding+border;(怪异模式)
[chrome高版本目前只支持标准模式(即使去掉<!DOCTYPE html>也不会变为怪异模式)，聚焦点为ie6模式下的渲染模式，两种模式差距较大，必须掌握不同模式下的盒子模型；渲染模式就是历史过渡的作用，现在几乎完成使命了]
[浏览器内置es标准，渲染引擎中的html解释器/css解释器，以及js引擎(解释器)能解析网页，底层还是因为内置解析的标准，开发网页也遵循同一套标准，这样才能把代码渲染到页面上，呈现给用户；若浏览器发布的时候内置es5.0标准，使用es3.0编写的网页在该浏览器中会有部分不兼容问题，怪异模式就是当浏览器处于该模式下，其可以向前兼容es3.0的网页] [目前浏览器基本都内置es3.0和es5.0，出现冲突的时候使用es3.0进行解析网页，若是使用es5.0严格模式编写网页，js引擎使用es5.0解析网页，es6.0好多浏览器还未内置]
(5).关于接口：手机/电脑操作系统都留有大量的接口；例如日常使用手机/电脑自定义的一些功能，亮度调节/闹钟/打电话等功能，其都是调用操作系统的接口即可；(若是没有接口或者不开放修改权限，那用户自然也不会选择使用)
(6).js加载时间线中提到异步加载过程中不要使用document.write(); 此方法以及innerHTML/innerText以及TextContent都会清空页面内容，使用过程慎重；
(7).页面布局过程中标签最好不要使用id属性，id常用作顶级模块名使用，以及前后端传输数据的过程中常涉及到id；(css选择器以及document获取元素的过程中也不要使用相关方法document.getElementById(); -->>> 推荐使用documents.getElementsByTagName();)
(8).关于事件捕获：div.addEventListener('click',fun,true);//常用的捕获形式，IE是不支持事件捕获的，但其也有一个特殊的方法实现捕获 - -> ele.setCapture();//仅在IE浏览器可用，dom元素会将页面中所有的事件硬捕获到自己身上，其常与div.releaseCapture();配套使用//捕获后需要释放，因为其对其他事件有坏处
(9).window.innerWidth/innerHeight;//其不包含工具栏，但其包含滚动条；IE中的document.documentElement.clientWidth/clientHeight;//其不包含滚动条；(测试过的，发现其和w3c标准有出入，应该是后续浏览器版本迭代原因； -> 辩证看待)
(10).innerHTML;//元素内包含的内容；outerHTML;//自身以及元素内的内容；获取/赋值过程中会替换掉该元素以及包含的内容；innerText;/outerText;// 取值过程中都是获取元素内容，没什么差别；赋值的过程中innerText会替换掉元素内容，而outerText则会把该元素以及元素内容都替换掉；[四个属性获取/赋值都是字符串形式]；
(11).原生js以及后续所学jQuery都可以“自定义事件”，使用方法同普通事件相同，$('ele').on('data-event',function(e,tel){});//回调函数中首个参数必须写事件对象，其它参数可随便写，否则系统依旧会将首个参数默认为事件对象，避免出错；
js升华篇js运动：
offsetLeft系列属性取值，只能取到整数，299.6-->299; 需要解决此bug,,而且其只能取到数字，运动中有讲到，，，getStyle(obj,prop); //封装的此方法，prop传入参数要为字符串，同时得到的值是字符串而非是数字，即使是透明渡也是"0,1" // console.log(getStyle(oDiv,'opacity'),typeof getStyle(oDiv,'opacity'))
设计思路：1.数组demo中选择以及下面的样式布局，2、轮播图中的左右按钮如何垂直居中，-> 广告的固定定位； 轮播图中下面的按钮设置，这些小圆点的处理，都是display:inine-block;所以都有文本的特性，所以可以使用text-align:block;
