js的兼容技巧

javascript原生代码中经常会遇到各式各样浏览器不兼容的问题,浏览器真是倔强,解决浏览器的兼容是前端猿们的一大难题

为了避免在工作中遇到这些简单的问题。节约开发时间,在这里总结一些常用的浏览器兼容原生js的一些问题

1.获取事件对象

e=e||window.event;

2.获取键码的通用代码

var keyCode = e.keyCode || e.which || e.charCode

 3.获取页面滚动距离

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

4.ajax获取xmlhttp对象

if(window.XMLHttpRequest) 
{ 
var oAjax=new XMLHttpRequest();//标准浏览器 
} 
else 
{ 
var oAjax=new ActiveXObject("Microsoft.XMLHTTP");//IE低版本 
}

6.取消默认事件

document.addEventListener('contextmenu',function(ev){ 
ev.preventDefault(); 
})) 
document.oncontextmenu = function(){ 
return false; 
} 

7.事件绑定

a.addEventListener("click",function(){
    //其他主流浏览器的事件绑定
}); 
a.attachEvent("onclick",function(){
//Ie浏览器的事件绑定
});

8.获取事件对象目标

getTarget: function(event){
  return event.target || event.srcElement;
 }

9.阻止事件冒泡的方法

stopPropagation: function(event){
  if (event.stopPropagation){
   event.stopPropagation();
  } else {
   event.cancelBubble = true;
  }
 }

10.访问剪贴板中的数据

getClipboardText: function(event){
  var clipboardData = (event.clipboardData || window.clipboardData);
  return clipboardData.getData("text");
 }

11.设置剪贴板中的数据

setClipboardText: function(event, value){
  if (event.clipboardData){
   return event.clipboardData.setData("text/plain", value);
  } else if (window.clipboardData){
   return window.clipboardData.setData("text", value);
  }
 }

12.对象的深度复制

function deepClone(obj){
               var o = obj instanceof Array ? [] : {};
                for(var k in obj)
                    o[k] = typeof obj[k] === Object ? deepClone(obj[k]) : obj[k];
                    return o;
         }

  

未完待续。。。。。。。。。。

原文地址:https://www.cnblogs.com/dangou/p/5531730.html