解决兼容性问题

解决兼容性的方法

1.清除浮动的兼容性：

             清除浮动在低版本浏览器不可以使用，需要处理兼容性加一个

         .clearfix{*zoom:1;}

 

2.rgb 和rgba和opacity的兼容性：

                   rgb  和 opacity在ie低版本中不支持，需要加一个filter：alpha（opacity=50）；

 

3.解决css3中的兼容性

          chrome（谷歌）的前缀-webkit-

          firefox（火狐）的前缀-moz-

          ie的前缀 -ms-

          poera（欧朋）的前缀-o-

国内的浏览器的内核都是谷歌

4.　LE6不支持document.documentElement

　　兼容写法

　　var w=document.element.clientWidnth||document.body.clientWidth

　　获取浏览器可见区的宽度

5.获取元素的子节点

　　元素.childNodes 这个属性有兼容性 标准浏览器会获取到文本节点而低版本的不会，所以建议使用children这个属性。

　　标准下     元素.firstElementChild

　　非标准下 元素.firstChild

　　兼容下写法

　　var list=document.getElementById("list")

　　var fist=list.firstElementChild||list.firstChild

　　console.log(fist)

6. js解救兼容性的方法

　　1.||

　　var dd=document.documentElement.clientWidth||document.body.clientWidth

　　2.if（）else{}

　　if(window.getComputedStyle){

    　　csss=window.getComputedStyle(aa,null)

　　}else{

   　　 csss=aa.currentStyle

　　}

　　console.log(csss)

　　3.try{}catch(err){}

　　必须在报错的条件下，和if  else比较性能上比较差，万不得已的情况下不能下

7.仿留言板

兼容性

　　元素没有子节点，ie低版本会读取不到，而标准浏览器会

　　因为标准浏览器会把文本节点当做子节点，而IE6-8不会

8.获取浏览器body的属性是有兼容的

　　兼容写法：var  ss=document.documentElement||document.body

9.Event的兼容性

　　在Chrome下event是undefined；在IE低版本下null；在火狐下会报错

　　document.onclick=function(e){

　　　　var e=e||window.event

　　}

10.mouseevent兼容性：

　　标准浏览器可以直接读取，但IE不行。

　　document.onclick=function(ev){

　　　　var ev=e||window.event

　　}

11.event对象的兼容性：

　　clientX和clientY是鼠标到浏览器窗口的左上角的距离

　　pageX和pageY是鼠标到网页左上角的距离坐标，但IE低版本没有这个属性

　　在IE下怎么算pageY的值？用client+scrollTop

12.阻止事件冒泡的兼容性写法

　　1.event.vancelBubble()

　　2.event.stopPropagation?event.stopPropagation():event.cancelBubble=ture

13.阻止事件默认行为兼容性

　　Event.preventDefault?Event.preventDefault():event.returnValue=false