Css中“.”可以选择包含两个样式的东西“，”可以都选上
img可以把div撑开 只设置宽 或者高那么将按照比列缩放扩大
Outline:none;//input text类型有外边框；
Preferences->Key Bindings->user->编辑文档 //代码对齐 { "keys": ["ctrl+alt+l"], "command": "reindent" },
cursor:pointer 小手
sub 上标
背景图定位：左右反 上下正
Display:none;放弃原来位置隐藏；
visibility:visible/hidden;平时可视/平时隐藏
play:none;不占位隐藏
visibility:hidden;占位隐藏
opacity 透明度
filter:alpha(opacity=60); 浏览器自己的透明滤镜
text-transform:uppercase;英文大写
text-transform:lowercase;英文小写
text-transform:capitalize;单次首字母大写
text-transform:none;原样式
prompt("");//
alert(“”);
confirm(“”)//弹出带选择选择框
Border-collapse:collapse;//table表的双边框变成但边框
**transition:all 5s ease 0s;//css样式转变时间//！！！震惊我一年！！
transform:rotate(90deg);//顺时针旋转九十度
Text-indent:-999em 或者px//段落首行缩进
=== 全等于
!== 不全等
条件 ? val1 : val2
Math.pow(5,7)
Math.sqrt()
Math.round()四舍五入的原理是在参数上加0.5然后进行下取整
有公式，如果想要在[a,b]闭区间取随机数，能取到a，也能取到b：
Math.random()能够生成一个0~1的数字，不包括0，也不包括1。术语叫做(0,1)开区间。
parseInt(Math.random() * (b - a + 1)) + a;
//
/数组
!!!!下标越界不报错 是unfinde
***push 尾插
***pop 尾删
***unshift 头插
***shift 头删
***Concat()//连接 连接的时候还得重新赋值 arr=arr.concat（arr2）
***Slice();//截取数组某一部分
***arr.slice(start,end) 返回一个新的数组，包含从 start 到 end （不包括该元素）的元素。
/
arr.splice(3,2,"斑马","骆驼");
一旦应用，arr立即改变。并不需要重新复制，换句话说，这个函数不返回新的数组。
var arr = ["A","B","C","D","E","F","G"]; arr.splice(3,2,"X","Y","Z","思密达"); //从数组下标为3开始这项，连数2项，改为…… console.log(arr);
// ***************插入一些项 *************** var arr = ["A","B","C","D","E","F","G"]; arr.splice(2,0,"嘻嘻","哈哈"); //插入到下标为2的项前，不删除项目 console.log(arr);
***reverse()；//翻转数组
***sort();数组排序
***arr.sort(function(a,b){
//如果a要放在b前面，那么返回负数 //如果a要放在b后面，那么返回正数 //如果a和b不区分大小，那么返回0 if(a < b){ return -1; }else if(a > b){ return 1; }else if(a == b){ return 0; }
});
//
///字符串///
***var str = arr.join(分隔符);如果不写分隔符，那么等价于用逗号分开
转为字符串
***charAt() 返回在指定位置的字符。
"abcdef".charAt(0);
和数组下标类似的。
***Arr.length
***indexOf() 检索字符串 //可以用于字符串
"我爱你亲爱的祖国的人民币".indexOf("的"); //5
***replace() 替换 funciton（match,....）中的match为 替换前的字符串
"abcdefgaa".replace("a","0"); // "0bcdefgaa"
把a替换为0 ， 只替换1个。
***split() 把字符串→数组， 从什么地方拆分， 就是参数
"我爱你亲爱的祖国的人民币".split("的");
***substr() 截取子串
“字符串”.substr(start,length)
"abcdefghijklmn".substr(3,5);
从下标为3的地方开始，取5个字符
***substring() 截取子串
“字符串”.substring(start,end); 不包括end
"abcdefghijklmn".substring(3,5);
***toLowerCase()、toUpperCase();
转换为大小写
split转为数组；
Join转为字符串
字符串方法返回值有三类：
返回数字类型：indexOf，lastIndexOf，search , charCodeAt
返回数组的方法：split，match
返回字符串的方法：charAt，substring，substr, slice, replace
//
//
正则表达式
Exec ///test
var str = /abc/g;
console.log(str.exec(demo));
普通字符包括：字母（abcABC），数字（123），_等等
特殊字符：() [] {} ^ $ * ? \ | + .
单词分隔符我们用\b表示 [a-zA-Z_0-9]之外的字符
非单词分隔符我们用\B表示
****字符集[] 里面放的东西test对象的一个东西
3.5预定义类
. [^\n\r] 除了换行和回车之外的任意字符
\d [0-9] 数字字符
\D [^0-9] 非数字字符
\s [ \t\n\x0B\f\r] 空白字符
\S [^ \t\n\x0B\f\r] 非空白字符
\w [a-zA-Z_0-9] 单词字符(所有的字母)
\W [^a-zA-Z_0-9] 非单词字符
3.6 量词
? 软性量词 出现零次或一次
* 软性量词 出现零次或多次(任意次)
+ 软性量词 出现一次或多次（至道一次）
{n} 硬性量词 对应零次或者n次
{n,m} 软性量词 至少出现n次但不超过m次(中间不能有空格)
{n,} 软性量词 至少出现n次(+的升级版)
3.7 修饰符
g 表示全局匹配
i 忽略大小写
m 多行匹配
3.8其他
[\u4e00-\u9fa5]表示中文集
| 表示或者的意思
alert(/a|b/.test('b')) =》 true
alert(/a|b/.test('c')) =》 false
3.9 分组
分组
1 解决多个字符串重复
2 可以在外面获取
格式 (任意个字符)
获取
在正则表达式内部获取：\数字
在正则表达式外部获取：$数字
注意数字是从1开始的。
// (function fun(){ alert("哈哈") })();
闭包
function text() { var arr = []; for (var i = 0; i < 10; i++) { (function (a) { arr[a] = function () { console.log(a); } //保存的是立即执行函数的成果AO() }(i)) } return arr; } //
不仅仅是class属性需要用className避讳一下，还有：
class 要写成.className
for 要写成.htmlFor （label用的）
rowspan 要写成rowSpan
colspan 要写成colSpan
setAttribute()、getAttribute()。
getAttribute(); //得到属性 setAttribute(); //设置属性
oImg.setAttribute("src","images/2.jpg"); 等价于 oImg.src = “images/2.jpg”;
setAttribute和点语法有一丢丢不一样：
第一，所有自定义的属性，都不能通过点语法得到
<div shaoshanhuan=”38”></div>
alert(oBox.shaoshanhuan); //undefined，自定义的属性，不是w3c的属性，都不能用点语法 alert(oBox.getAttribute("shaoshanhuan")); //38
Onclick 单击
Onmouseover 鼠标进入
Onmouseout 鼠标离开
Ondblclivk 双击
Onfouse 得到焦点
Onblue 失去焦点
Onmousedown 鼠标按下
Onmouseup 鼠标按键抬起
Windows.onload 页面中的代码完全加载完毕以后
play:none;隐层
play:block;显示
innerHTML//内部文本
document.getElementsByName(“”)//里面放的是表单中的name
window.getComputedStyle(oDiv).getPropertyValue("width")
getPropertyValue看上去就像打它，看着就不爽，所以可以简写：
getComputedStyle(oDiv)["padding-left"]
好用的东西，一定不兼容。所以IE6、7、8不兼容getComputedStyle.getPropertyValue()的写法，另外一套写法：附加在元素身上的currentStyle属性，它表现和style点语法一样，使用驼峰式访问。
oDiv.currentStyle.width
现在要注意，它必须使用驼峰：
oDiv.currentStyle.paddingTop
oDiv.currentStyle["paddingLeft"]
总结：
高级：
高级： window.getComputedStyle(oDiv).getPropertyValue("padding-left"); getComputedStyle(oDiv).getPropertyValue("padding-left"); getComputedStyle(oDiv)["padding-left"]; IE6、7、8： oDiv.currentStyle.paddingLeft; oDiv.currentStyle["paddingLeft"];
兼容性问题
if(window.getComputedStyle){ alert("我会getComputedStyle"); }else{ alert("我不会getComputedStyle，那四个啥？")
}
现在我们要在一个轮子，就是封装一个函数，这个函数接收两个参数，第一个是对象，第二个是属性名。
fetchComputedStyle(obj,”padding-left”); fetchComputedStyle(obj,”paddingLeft”);
这个函数返回的是这个属性值的计算后的样式。更牛逼的是，我们无论用户输入的是驼峰还是非驼峰，都让这个函数鲁棒。
div.currentStyle.opacity //可以得到css清单中的opactiy里面写的值。而不是filter的值。
支持opacity的浏览器，总会将.6这种写法规范为0.6 。 而不支持opacity的浏览器则会返回原有的形式.6。这是一个小坑，进行比较的时候需要注意。
IE6、7 |
IE8 | IE9、IE9+、高级浏览器 | |
offsetParent |
如果自己没有定位，那么就是自己父亲中有width或者有height或者有定位的元素。 如果自己有定位，那么就是和高级浏览器一致。 |
和高级浏览器一致 | 自己祖先元素中，离自己最近的已经定位的元素 |
| offsetLeft | 和高级浏览器一致 |
多算一条border |
自己的border外到offsetParet对象的border内 |
ele.offsetLeft
ele.offsetTop
ele.offsetWidth
ele.offsetHeight
ele.clientWidth
ele.clientHeight
一、clientWidth和clientHeigh 、 clientTop和clientLeft
1，clientWidth的实际宽度
clientWidth = width+左右padding//浏览器的宽度
2，clientHeigh的实际高度//浏览器的高度
clientHeigh = height + 上下padding
3，clientTop的实际宽度
clientTop = boder.top(上边框的宽度)
4，clientLeft的实际宽度
clientLeft = boder.left(左边框的宽度)
二、offsetWidth和offsetHight 、 offsetTop和offsetLeft
1,offsetWidth的实际宽度
offsetWidth = width + 左右padding + 左右boder
2,offsetHeith的实际高度
offsetHeith = height + 上下padding + 上下boder
3，offsetTop实际宽度
offsetTop：当前元素 上边框 外边缘 到 最近的已定位父级（offsetParent） 上边框 内边缘的 距离。如果父级都没有定位，则分别是到body 顶部 和左边的距离
4，offsetLeft实际宽度
offsetLeft：当前元素 左边框 外边缘 到 最近的已定位父级（offsetParent） 左边框 内边缘的距离。如果父级都没有定位，则分别是到body 顶部 和左边的距离
timer = setInterval(function(){ },20) clearInterval(timer);
这个按钮持续点击，盒子运动越来越快。这是因为每次点击，盒子身上就有更多的定时器在作用。
解决办法，就是四个字的口诀“设表先关”。
startBtn.onclick = function(){ //设表先关 clearInterval(timer); //设置定时器 timer = setInterval(function(){ nowleft += 2; oDiv.style.left = nowleft + "px"; }, 20); }
所以解决办法，就是验收、拉回终点、停表：“拉终停表”
var timer = setInterval(function(){ nowleft += 7; if(nowleft > 600){ nowleft = 600; clearInterval(timer); } oDiv.style.left = nowleft + "px"; console.log(nowleft); },20);
间隔时间是以毫秒为单位，1000毫秒就是1秒。
“毫”就是千分之一，
“厘”就是百分之一，
“分”就是十分之一
var obj = { "name":"考拉", "age" : 18 };
obj.sex = "刚变完性";
for(var k in obj){ console.log(k + "的值是" + obj[k]);
}
Var t=new Date();
Call apply//
//
callback.call(elem);
或者：
callback.apply(elem);
执行callback函数，并且让callback函数中的this关键字为elem。
说白了apply、call功能是一样的，功能都是：让函数调用，并且给函数设置this是谁。
function xianshixinxi(a,b,c){ console.log(this.name); console.log(a + b + c); } xianshixinxi.call(obj,2,3,4);
xianshixinxi.apply(obj,[2,3,4]);
window.setTimeout(函数,时间);
在指定时间之后，执行函数一次，仅仅执行1次。
clearTimeout();
function linear(t , b , c , d){ return c * t / d + b; } function easeIn(t,b,c,d){ return c * ( t /= d) * t + b; } function easeOut(t,b,c,d){ return -c *(t/=d)*(t-2) + b; }
他们的参数，都是t、b、c、d：
第一个参数t表示当前帧编号
第二个参数b表示起始位置
第三个参数c表示变化量
第四个参数d表示总帧数
函数的返回值，就是t这一帧，元素应该在的位置。
clearTimeout();
