在js中好用的东西一般都存在兼容问题,以下,我整理了一些常用的兼容处理方法,自己用的时候可以把他们放在一个JS文件中,需要用到时候直接引入,会比较方便.

一、获取非行内样式

function getStyle(ele,attr){
if(ele.currentStyle){
return ele.currentStyle[attr];
}else{
return getComputedStyle(ele,false)[attr];
}
}

【注】:这里arrt作为变量,要使用中括号语法。

二、事件对象的获取

//事件对象的获取兼容
function getEvent(ele){
var e = ele || window.event;
}

三、事件冒泡

//事件冒泡的兼容
function stopBubble(e){
if(e.stopPropagation){
e.stopPropagation();
}else {
e.cancelBubble = true;
}
}

四、阻止浏览器默认行为

//阻止默认事件的兼容
function prevent(eve){
var e = eve || window.event;
if(e.preventDefault){
e.preventDefault();
}else {
e.event.returnValue = false;
}
}

Tip:这里还有一种很简单的写法,在代码的最后一行加上return false;一定要注意的是,这句代码一定在所写事件的最后一行,不然后面的代码都执行不了,用的时候要注意。

五、事件绑定以及事件删除

  1.监听式事件的绑定

//监听式绑定
function addEvent(ele,type,cb){
if(ele.addEventListener){
ele.addEventListener(type,cb);
}else if(ele.attachEvent){
ele.attachEvent("on"+type,cb);
}else {
ele["on" + type] = cb;
}
}

  2.监听式事件的删除

//删除绑定
function romoveEvent(ele,type,cb){
if(ele.removeEventListener){
ele.romoveEventListener(type,cb);
}else if(ele.detachEvent){
ele.detachEvent("on"+type,cb);
}else {
ele["on"+type] = null;
}
}

六、键盘事件

//键盘检测兼容
function KeyC(eve){
var e = eve || window.event;
var keyc = e.keyCode || e.which;
return keyc;
}

JavaScript中几种常见的兼容问题及解决方案的更多相关文章

  1. JavaScript 中 4 种常见的内存泄露陷阱

    了解 JavaScript 的内存泄露和解决方式! 在这篇文章中我们将要探索客户端 JavaScript 代码中常见的一些内存泄漏的情况,并且学习如何使用 Chrome 的开发工具来发现他们.读一读吧 ...

  2. JavaScript中五种常见运算符

    一. in运算符 in运算符希望它的左操作数是一个字符串或可以转换为字符串,希望它的右操作数是一个对象.如果右侧的对象拥有一个名为左操作数值的属性名,那么表达式返回true.例如: var point ...

  3. javascript中五种常见的DOM方法

    getElementById将返回一个与那个有着给定id属性值的元素节点对应的对象. <html xmlns="http://www.w3.org/1999/xhtml"&g ...

  4. JavaScript版几种常见排序算法

    今天发现一篇文章讲“JavaScript版几种常见排序算法”,看着不错,推荐一下原文:http://www.w3cfuns.com/blog-5456021-5404137.html 算法描述: * ...

  5. JS中几种常见的数组算法(前端面试必看)

    JS中几种常见的数组算法 1.将稀疏数组变成不稀疏数组 /** * 稀疏数组 变为 不稀疏数组 * @params array arr 稀疏数组 * @return array 不稀疏的数组 */ f ...

  6. Spring RestTemplate中几种常见的请求方式

    https://github.com/lenve/SimpleSpringCloud/tree/master/RestTemplate在Spring Cloud中服务的发现与消费一文中,当我们从服务消 ...

  7. 自然语言处理的CNN模型中几种常见的池化方法

    自然语言处理的CNN模型中几种常见的池化方法 本文是在[1]的基础上进行的二次归纳. 0x00 池化(pooling)的作用   首先,回顾一下NLP中基本的CNN模型的卷积和池化的大致原理[2].f ...

  8. [js]javascript中4种异步

    javascript中4种异步: 1.ajax 2.定时器 3.事件绑定 4,回调 定时器 //顺序执行 /* var s = 0; for (var i = 0; i < 10000; i++ ...

  9. Spring RestTemplate中几种常见的请求方式GET请求 POST请求 PUT请求 DELETE请求

    Spring RestTemplate中几种常见的请求方式 原文地址: https://blog.csdn.net/u012702547/article/details/77917939   版权声明 ...

随机推荐

  1. 三、SQL server 2008数据库的备份与还原

    一.SQL数据库的备份:   1.依次打开 开始菜单 → 程序 → Microsoft SQL Server 2008 → SQL Server Management Studio → 数据库:Dsi ...

  2. HTML页面中的布局问题

    在做网站中,给整个大的框架宽度设置为100%,然后设置body的最小宽度是网站的内容部分的宽度.网站内容的宽度是固定的.

  3. Anacodna之conda的使用

    yum install -y bunzip2 wget https://repo.continuum.io/archive/Anaconda2-5.0.1-Linux-x86_64.sh chmod ...

  4. Maven重新下载未下载完成的jar包

    使用maven下载jar包,经常会遇到下载失败的情况,如果失败的jar包过多,或是不清楚到底有那些jar包在下载过程中出现了问题.可通过maven命令重新批量下载未成功的jar包. 1,打开cmd , ...

  5. Set接口的使用

    Set集合里多个对象之间没有明显的顺序.具体详细方法请参考API文档(可见身边随时带上API文档有多重要),基本与Collection方法相同.只是行为不同(Set不允许包含重复元素). Set集合不 ...

  6. C++学习之路

    一.二分查找 1.binary_search:查找某个元素是否出现. a.函数模板:binary_search(arr,arr+size ,indx) b.参数说明: arr: 数组首地址 size: ...

  7. .net持续集成sonarqube篇之 sonarqube与jenkins集成(插件模式)

    系列目录 Jenkins通过插件集成Sonarqube 通过上一节我们了解了如何配置以使jenkins ci环境中可以执行sonarqube构建,其实Sonarqube官方也提供了jenkins插件以 ...

  8. restapi(3)- MongoDBEngine : MongoDB Scala编程工具库

    最近刚好有同事在学习MongoDB,我们讨论过MongoDB应该置于服务器端然后通过web-service为客户端提供数据的上传下载服务.我们可以用上节讨论的respapi框架来实现针对MongoDB ...

  9. SonarQube+Jenkins安装工程中遇到的吭

    1. SonarQube是不是有点飘了,居然要java11+才能运行 解决方案: 重新下载老版本 也不知道哪个版本才好用,就下载了7.0 和6.6,这两个版本用jdk1.8就可以用 2. 配置数据库u ...

  10. Python学习系列(三)Python 入门语法规则1

    一.注释 ''' 多行注释 ''' #单行注释 '''    #example1.1 测试程序  时间:4/17/2017 i1=input("请输入用户名:") i2=input ...