首页 > 代码库 > 常用原生JS兼容写法

常用原生JS兼容写法

2024-10-05 06:03:39   214人阅读

在我们前端开发中,经常会遇到兼容性的问题,因为要考虑用户会使用不同的浏览器来访问你的页面,你要保证你做的网页在任何一个浏览器中都能正常的运行,下面我就举几个常用原生JS的兼容写法:

1:添加事件方法

addHandler：function(element,type,handler){

 if(element.addEventListener){//检测是否为DOM2级方法
  element.addEventListener(type, handler, false);
 }else if (element.attachEvent){//检测是否为IE级方法
  element.attachEvent("on" + type, handler);
 } else {//检测是否为DOM0级方法
  element["on" + type] = handler;
 };
};
2:获取事件及事件对象目标
 getEvent: function(event){
  return event ? event : window.event;
 },
 getTarget: function(event){
  return event.target || event.srcElement;
 };
3:阻止浏览器默认事件的兼容性写法
preventDefault: function(event){
  if (event.preventDefault){
   event.preventDefault();
  } else {
   event.returnValue = http://www.mamicode.com/false;
  };
 };
4:阻止事件冒泡的兼容性写法
stopPropagation: function(event){
  if (event.stopPropagation){
   event.stopPropagation();
  } else {
   event.cancelBubble = true;
  };
 };
5:跨浏览器的方式取得字符编码
getCharCode: function(event){
 if (typeof event.charCode == "number"){
  return event.charCode;
 } else {
  return event.keyCode;
 };
};
基本原生JS中兼容性问题我能想起来的也就这么多了,希望对大家的学习有帮助.
另外多加一个CSS3中兼容性写法
　　　-webkit这个为浏览器的前缀代表浏览器的私有属性
        -ms 这是IE浏览器的前缀
        -moz 这代表了火狐浏览器的前缀
        -o  这代表着欧朋浏览器
        -webkit  这代表了谷歌浏览器和苹果浏览器
今天就先写到这里了,明天见!
 
 
 
坚持!坚持!坚持!坚持!坚持!

常用原生JS兼容写法


联系
我们