工作小计

自己踩过的坑、网上收集、及一些常用的小代码方便以后复制黏贴。

1.手机端必要申明：<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">

2.强制不换行，省略号：overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all

3.flash透明：<param name="wmode" value="transparent" /> 不要有： <param name="wmode" value="opaque" />

4.object 挡住div ,object添加<param name="wmode" value="opaque" />即可

5.低版本IE的hack：IE6下“_”,IE7下“*”

6.p始终有外边距，严格检查编辑器是否有空格！

7.IE6,7 margin负值BUG，给负值元素加：*zoom:1;_position:relative;

8.去掉chrome、火狐（以及360）input在得到焦点时出现黄色（蓝色）边框的方法:input{outline:0px;}

9.jq width()方法用于获得元素宽度；innerWidth()方法用于获得包括内边界（padding）的元素宽度，outerWidth()方法用于获得包括内边界(padding)和边框(border)的元素宽度，如果outerWidth()方法的参数为true则外边界(margin)也会被包括进来

10.jq使用animate()时，最好在前面加个stop()

11.简单粗暴处理冒泡，用mouseenter 、 mouseover ，只会在绑定的元素上触发。 mouseleave 同理

12.透明兼容IE：filter:alpha( topacity=70);opacity:0.7

13.IE7 line-block 无效，使用：*display:line;平稳退化

14.iframe在ie78 下默认背景是白色，需要透明设置： allowTransparency="true" ，iframe里video标签没有全屏按钮，是因为iframe没有加“allowfullscreen=true”

15.firefox 单独hack:@-moz-document url-prefix() { .requi{position: relative;top: -18px;} }

16.jquery 动画效果从哪儿爆开，与定位left right bottom top 有关

17.元素设置position后，margin属性IE7下失效问题：元素同级的地方加：<!–[if lte IE 7]><div></div><[endif]–>

18.图片响应式布局：img标签时:width:100%;max-width:100%;  背景图时：background:url(../images/xx.jpg) 50% 50% no-repeat;-webkit-background-size:cover;background-size:cover;margin-bottom:20px;padding-top:56%(图片宽/高比);

19.video标签有一个很操蛋的属性就是，宽和高中的其中一个属性碰到了父级盒子的边缘，那video就不在自适应或者遵循CSS的样式，解决方法，只给width：100%；不要高度属性 

20.手机端，去掉点击时的背景色：-webkit-tap-highlight-color: transparent

21.flex 布局：father {display:flex;  display:-webkit-flex; flex-flow:row; -webkit-flex-flow:row; justify-content:space-around; }child { box-flex:1.0; -webkit-box-flex:1.0; }

22.护眼色：background-color:#C7EDCC

23.很多情况下，我们把 hasLayout的状态改成true 就可以解决很大部分ie下显示的bug

24.js 同名函数始终执行最后一个函数

25.IE678 background:url() no-repeat;注意中间的空格

26.word-wrap:break-word;word-break:break-all;解决英文 不换行，遇到“-”换行问题 ;但是单词会被强制断开，原因是数据库读出的&nbsp;需要用JS控制：

<script type="text/javascript">
	var a=document.getElementById("a").innerHTML;
	alert(a);
	a = a.replace(/ /g," ");
	document.getElementById("a").innerHTML=a;
</script>

27.闭包阶乘：

var a = (function(n){ 
if(n<1){ alert("invalid arguments"); 
return 0;
} 
if(n==1){ return 1; } 
else{ return n * arguments.callee(n-1); } })(4);
document.writeln(a); 

//（）（）这个形式：第一个括号里是一个函数，先假设函数名为myFun，第二个括号里的数据则为函数myFun的参数。
//而且myFun不用经过调用就可以执行一次。

28.创建对象时，键值对中"键"是否使用引号，取决于"键"是否有空格或者连接符，如：

var student = {
 name:"zhangsan",
 "add ress":"cd",
 "s-ex":"man"}

29.函数声明可以在函数前面调用，而函数表达式则不行，如：

add(1,2); //得到3
function add(a,b){
 return a+b;   
}
ad(2,3); //报错
var ad = function(a,b){
 return a+b;
}
ad(3,4);//7

30.对象的属性获取和设置可以用“.”和“'[]”，它们的区别是，“.”后面的是自身属性，而“[]”里的可以是变量。比如：

var o = {
 name:"zhangsan"
}
o.name; //"zhangsan"
var nm = "name";
o[nm]; //"zhangsan"

31.HTML中，遇到文字中有“-”符号被换行了，用：word-break:keep-all;