兼容性(js)

  1. DOM节点获取
//DOM节点相关,主要兼容IE 6 7 8
  function nextnode(obj){//获取下一个兄弟节点
    if (obj.nextElementSibling) {
      return obj.nextElementSibling;//非IE678支持
    } else{
      return obj.nextSibling;//IE678支持

    };
  }
  1. 事件event获取源
//event事件问题
  document.onclick=function(ev){//谷歌火狐的写法,IE9以上支持,往下不支持;
    var e=ev;
    console.log(e);
  }
  document.onclick=function(){//谷歌和IE支持,火狐不支持;
    var e=event;
    console.log(e);
  }


//兼容写法;
  document.onclick=function(ev){//兼容写法;
    var e=ev||window.event;
    var mouseX=e.clientX;//鼠标X轴的坐标
    var mouseY=e.clientY;//鼠标Y轴的坐标
  }

3.获取ClassName问题

  1. innertext兼容性
Safari、Opera和Chrome支持innerText属性。
Firefox虽然不支持innerText,但支持作用类似的textContent属性
var div = document.getElementById("content");
function setInnerText(element, text) {
    if (typeof element.textContent == "string") {   //Firefox
        element.textContent = text;    
    } else {
        element.innerText = text;
    }
}
function getInnerText(element) {
    return (typeof element.textContent == "string") ? element.textContent : element.innerText;
}
setInnerText(div, "Hello world!");
alert(getInnerText(div)); //"Hello world!"

5.设置监听事件

//设置监听事件
   function addEvent(obj,type,fn){//添加事件监听,三个参数分别为 对象、事件类型、事件处理函数,默认为false
    if (obj.addEventListener) {
      obj.addEventListener(type,fn,false);//非IE
    } else{
      obj.attachEvent('on'+type,fn);//ie,这里已经加上on,传参的时候注意不要重复加了
    };
  }
  function removeEvent(obj,type,fn){//删除事件监听
    if (obj.removeEventListener) {
      obj.removeEventListener(type,fn,false);//非IE
    } else{
      obj.detachEvent('on'+type,fn);//ie,这里已经加上on,传参的时候注意不要重复加了
    };
  }

你可能感兴趣的:(兼容性(js))