javascript(常见的兼容性问题及解决办法)

     在javascript中经常遇到一些兼容性的问题，下面博主将列举一些常见的兼容性问题及解决办法

处理innerText和textContent

//处理innerText和textContent
function getInnerText(element){
	//判断element是否支持innerText
	if(typeof element.innerText === 'string'){
		return element.innerText;
	}else{
		return element.textContent;
	}
}
//设置元素之间的内容
function setInnerText(element,content){
	if(typeof element.innerText === 'string'){
		element.innerText = content;
	}else{
		element.textContent = content;
	}
}

  处理firstElementChild的兼容性

  //处理firstElementChild的兼容性
  function  getFirstElementChild(parent) {
	//如果当前浏览器支持firstElementChild
	if(parent.firstElementChild){
		return parent.firstElementChild;
	}
	var node, nodes = parent.childNodes, i = 0;
	while (node = nodes[i++]) {
		if (node.nodeType === 1) {
			return node;
		}
	}
	return null;
}

注册事件，处理兼容性问题

//注册事件，处理兼容性问题
function addEventListener(element,eventName,callback){
	if(element.addEventListener){
		element.addEventListener(eventName,callback,false);
	}else if(element.attachEvent){
		element.attachEvent('on'+eventName,callback);
	}else{
		element['on'+eventName] = callback;
	}
}

移除事件，处理兼容性问题

//移除事件，处理兼容性问题
function removeEventListener(element,eventName,callback){
	if(element.removeEventListener){
		element.removeEventListener(element,callback,false);
	}else if(element.detachEvent){
		element.detachEvent('on'+eventName,callback);
	}else{
		element['on'+eventName] = null;
	}
}

获取页面滚动的距离，并处理兼容性

//获取页面滚动的距离，并处理兼容性
 function getScroll(){
    return {
        scrollTop:document.documentElement.scrollTop || document.body.scrollTop,
        scrollLeft:document.documentElement.scrollLeft || document.body.scrollLeft
    }
}

获取鼠标在页面上的坐标 解决IE8的问题

//获取鼠标在页面上的坐标  解决IE8的问题
 function getPage(e){
    return{
        pageX:e.clientX + getScroll().scrollLeft,
        pageY:e.clientY + getScroll().scrollTop
    }
}