js常见IE兼容问题以及兼容写法

1. charAt()方法，用于字符串不支持[ ]中括号索引

'hello,word'.charAt(9) // 'd'

2. 滚动距离兼容写法

var scrollTop = document.documentElement.scrollTop || document.body.scrollTop

3. 获取行内样式

function getStyle(obj, name) {
    if(window.getComputedStyle) {
        // 非IE浏览器
        return getComputedStyle(obj,null)[name]
    } else {
        // 针对IE浏览器
        return obj.currentStyle[name]
    }
}

4. 事件对象event兼容

var obj = querySelector('getName')
obj.onclick = function(eve) {
	var e = eve || window.event
    // 执行体...
}

5. target 兼容写法(常用于事件委派里)

document.querySelector('ul').onclick = function(eve) {
    var e = eve || window.event
    var target = e.target || e.srcElement
    if(target.nodeName == 'LI') {
    	// 执行体...
    }
    if(target.className == 'GETUSER') {
    	// 执行体...
    }
    // 执行体...
}

6. 阻止冒泡兼容写法

function stopBubble(e) {
    if(e.stopPropagation) {
        e.stopPropagation()
    } else {
        e.cancleBubble = true
    }
}

7. 阻止浏览器默认行为

document.querySelector('li').onclick = function(eve) {
    // 只支持高版本浏览器
    // e.preventDefault()
    
    // IE9以下浏览器
    // e.returnValue = false
    
    // 企业开发推荐使用
    return false
}

8. 事件监听兼容写法

function addEvtListen(ele, type, callback) {
    if(ele.addEventListenr) {
        ele.addEventListenr(type,callback,false)  // 参数三表示是否允许冒泡
    } else if(ele.attachEvent) {
        // 兼容IE
        ele.attachEvent('on' + type,callback) // 只支持冒泡
    }
}