js常见的兼容性问题

取行外样式的值

我们都知道通过js 的style 不能行外样式 ，当我们想要获取行外样式时一般需要用下面的两个方法；
1 IE 的取值方法；currentStyle
2 Chrome 的方法 getComputedStyle(oDiv,false)
他们的兼容写法

function getStyle(domObj, attr) {
	if(window.getComputedStyle) {
	//兼容谷歌
		return getComputedStyle(domObj, null)[attr];
	}
	兼容IE
	return domObj.currentStyle[attr];
}
//传参方式 getStyle(oDiv,"width") 属性不要忘记加引号；

2关于索引获取字符串的每一项的问题；

对于字符串也有类似数组通过下标获取每一项的值；

var str = "abc";
aletr(str[1]);

但是IE浏览器并不支持
兼容方法：charAt(i);//兼容全部浏览器

        var str = "abcd"
		alert(str.charAt(1))

3关于使用 event对象，出现的兼容性问题;

dragEle.onmousedown = function(e){
				var evt = e || event;	
		}

4关于滚动条出现的兼容性问题

Chrome 认为滚动条是body的可以通过body.scrollTop 来获取
火狐等浏览器认为滚动条是HTML的；
兼容性写法；
var st = document.body.scrollTop ||document.documentElement.scrollTop;

5 封装Dom2 级事件处理函数；事件监听；

添加事件监听器：addEventListener(事件名，处理函数，布尔值)
移除事件监听器：removeEventLisener(事件名，处理函数)；

注意：事件名不带 on 处理函数为函数指针 ，布尔值表示冒泡或捕获 默认false 为冒泡；如果布尔值是true 就是捕获；

IE下的事件监听器：attachEvent(事件名，处理函数)，detachEvent(事件名，处理函数)

注意：事件名带on 默认冒泡 支持捕获；

传统事假和DOM 2级事件的区别；

1.传统事件绑定同一事件句柄只能绑定一个事件函数，绑定多个后面的会覆盖前面的；DOM2级事件支持同一元素的同一事件句柄可以绑定多个监听函数；
话不多说啦：来封装事件处理函数

			事件监听封装 ：
			//参数1 Dom 对象 参数 2 事件类型 参数3 函数
           function addEvent(domObj,type,fn){
				if(domObj.addEventListener){
					domObj.addEventListener(type,fn);
				}else{
					domObj.attachEvent("on"+type,fn)
				}
			}
			移除事件监听；
			参数 参照上面；
			function removeEvent(domObj,type,fn){
				if(domObj.removeEventListener){
					domObj.removeEventListener(type,fn);
				}else{
					domObj.detachEvent("on"+type,fn);
				}
			}