解决兼容性的方法
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