处理浏览器兼容性(持续更新)

*css兼容性处理

1、清除浮动的兼容性(低版本的浏览器不兼容问题)

.clearfix:after{

  content:"";

  clear:both;

  display:block;

  visibility:hidden;

  height:0;

}

.clear{

       *zoom:1;

}

2、透明度的兼容性

opacity:0.3;

filter:alpha(opacity=30);

3、各种国外浏览器在CSS3中的兼容问题

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

Chrome的前缀-webkit-

Firefox的前缀-moz-

IE的前缀-ms-

Opera的前缀-o-

*JS兼容性处理

1、document获取根节点的兼容性(Ie6不支持document.documentElement)

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

获取第一个子节点的兼容写法

var list=document.getElementById("list")

var first=list.firstElementChild||list.firstChild

获取最后一个子节点 lastELementChild||lastChild

获取上一个兄弟节点 previousSibling||previousElementChild

获取下一个兄弟节点nextSibling||nextElementSibling

 

2、if()else()

例一:获取window下所有经过计算机计算的属性

if(window.getComputedStyle){

  csss.window.computedStyle(当前元素,null)

}else{

      csss.aa.currentStyle

}console.log(csss)

例二:获取元素的子节点并向后添加一个元素

if(父元素.children[0]){

  父元素.insertBefore(子元素,在谁前面加)

}else{

  父元素.appendChild(子元素)

}

3、try{}catch(err){}

例:获取window下所有经过计算机计算的属性

 

var csss;

 

    try{

 

        csss=window.getComputedStyle(aa,null)

 

    }catch(e){

 

        csss=aa.currentStyle

 

    }

 

    console.log(csss)

4、获取浏览器的body属性的兼容性

var body=document.body||document.documentElement;

5、获取函数中的事件对象event的兼容性

标准:event是undefined;

非标准:null;

兼容:var e=e||window.event;

6、时间绑定的第二种写法

标准浏览器用:addEventListener()

非标准用:attachEvent()

addEventListener(参数1,参数2,参数3)

参数1:事件名,并且不带"on"

参数2:事件函数

参数3:布尔值,代表捕获不捕获,默认值是false,不捕获单冒泡

7、event对象的兼容性

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

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

那么IE该如何计算pageY的值?

clientY+scrollTop

8、获取事件源(e.target)的兼容性

标准下:e.target

非标准:e.srcElement

兼容性写法:e.target||e.srcElement

9、阻止事件冒泡的兼容性

标准和非标准都兼容的:event.cancelBubble=true

标准:event.stopPropagation()

兼容这两者:event.stopPropagation?event.stopPropagation():event.cancelBubble=true

10、阻止事件的默认行为的兼容性

例如:a

a.href="javascript:;"取消刷新

标准和非标准都兼容取消刷新:event.preventDefault?event.preventDefault():event.returnValue=false

 

 

原文地址:https://www.cnblogs.com/qinlinkun/p/9768741.html