获取非行内样式的兼容方式

function getStyle(obj,attr){  //获取非行间样式,obj是对象,attr是值
if(obj.currentStyle){ //针对ie获取非行间样式
return obj.currentStyle[attr];
}else{
return getComputedStyle(obj,false)[attr]; //针对非ie
}
}

  获取事件对象的兼容方式

document.onclick=function(eve){
var e=eve||window.event;
console.log(e);
}

  事件冒泡的兼容方法

function stopBubble(e){
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble = true;//兼容ie
}
}

  阻止浏览器默认行为的兼容方法

    if( e.preventDefault ){
e.preventDefault();
}else{
window.event.returnValue = false;//ie
}

  监听事件的设置和移除的兼容方式

.封装成对象的方式
var EventUtil={
addHandler:function(DOM,EventType,fn){
if(DOM.addEventListener){
DOM.addEventListener(EventType,fn,false);
}else if(DOM.attachEvent){
DOM.attachEvent('on'+EventType,fn)
}else{
DOM['on'+EventType]=fn
}
},
removeHandler:function(DOM,EventType,fn){
if(DOM.removeEventListener){
DOM.removeEventListener(EventType,fn,false)
}else if(DOM.detachEvent){
DOM.detachEvent('on'+EventType,fn)
}else{
DOM['on'+EventType]=null;
}
}
} .封装成两个函数的方式
function addEvent(obj,inci,back){
if(obj.addEventListener){
obj.addEventListener(inci,back);
}else if(obj.attachEvent){
obj.attachEvent("on" + inci,back);
}else{
obj["on"+inci] = back;
}
} function removeEvent(obj,inci,back){
if(obj.removeEventListener){
obj.removeEventListener(inci,back,false);
}else if(obj.detachEvent){
obj.detachEvent("on" + inci,back);
}else{
obj["on"+inci] = null;
}
}

  事件委托的兼容方法

var oul = document.querySelector("ul")
oul.onclick = function(eve){
var e = eve || window.event; var t = e.target || e.srcElement; if(t.getAttribute("abc") == "l"){
console.log(e.target.innerHTML)
} }

  键盘事件的兼容方法

var eve = eve||window.event;
var keyC = eve.keyCode||eve.which;

  以上是本人在学习js过程中遇见的几个兼容方式的汇总,如果哪里有错误希望大家指出,谢谢。

JS中兼容问题的汇总的更多相关文章

  1. js中的DOM操作汇总

    一.DOM创建 DOM节点(Node)通常对应于一个标签,一个文本,或者一个HTML属性.DOM节点有一个nodeType属性用来表示当前元素的类型,它是一个整数: Element,元素 Attrib ...

  2. js中typeof的用法汇总[转载]

    http://www.jb51.net/article/43187.htm JavaScript中的typeof其实非常复杂,它可以用来做很多事情,但同时也有很多怪异的表现.本文列举出了它的多个用法, ...

  3. js中typeof的用法汇总

  4. JS中常遇到的浏览器兼容问题和解决方法

    今天整理了一下浏览器对JS的兼容问题,希望能给你们带来帮助,我没想到的地方请留言给我,我再加上: 常遇到的关于浏览器的宽高问题: //以下均可console.log()实验 var winW=docu ...

  5. js中getBoundingClientRect的作用及兼容方案

    js中getBoundingClientRect的作用及兼容方案 1.getBoundingClientRect的作用 getBoundingClientRect用于获取某个html元素相对于视窗的位 ...

  6. JS中常遇到的浏览器兼容问题和解决方法【转】

    今天整理了一下浏览器对JS的兼容问题,希望能给你们带来帮助,我没想到的地方请留言给我,我再加上: 常遇到的关于浏览器的宽高问题: //以下均可console.log()实验 var winW=docu ...

  7. 分享一个自定义的 console 类,让你不再纠结JS中的调试代码的兼容

    问题的产生 在写JS的过程中,为了调试我们常常会写很多 console.log.console.info.console.group.console.warn.console.error代码来查看JS ...

  8. js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符

    js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...

  9. js中的总结汇总(以后的都收集到这篇)

    点1:js中的比较字符串是否相等,js中是用"=="这个来判断是否相等,这点跟java中不一样,java中是.equals()这种方法. 在之前写的ajax的demo中,因为用了. ...

随机推荐

  1. 状态管理工具对比vuex、redux、flux

    1.为什么要使用状态管路工具  在跨层级的组件之间传递信息,尤其是复杂的组件会非常困难.也不利于开发和维护,这时我们就a需要用到状态管理工具.     2.Flux

  2. PHP入门培训教程 PHP变量的使用

      很多朋友在编写PHP程序的时候有时候对变量总有着不能确定的问题,而且也有很多问题就是因为变量的处理不当所造成的.这里兄弟连PHP培训 小编,就PHP变量系统说一下. PHP的变量分为全局变量与局部 ...

  3. Java——常用类(Enum)

    [枚举类型]  <1>只能取特定值中的一个.  <2>使用enum关键字.  <3>是java.lang.Enum类型.   [程序分析]    public en ...

  4. adaboost面试题

    1.简述权值更新方法 (1)初始化权值分布: (2)找到误差最小的弱分类器: (3)计算弱分类器的权值: (4)更新下一轮样本的权值分布: (5)集合多个弱分类器成一个最终的强分类器. 2.为什么能快 ...

  5. 如何理解重载与重写——Overload vs Override/Overwrite

    重载: 在同一个类中,拥有类似功能的同名方法之间的关系叫做重载. 重载的条件:1.具有相同方法名和类似功能: 2.参数的类型或者个数不同: 3.与返回值无关: 重写: 在子父类的继承关系中,子类继承父 ...

  6. docker学习与应用

    概要 众所周知,Docker是当前非常火的虚拟化容器技术,对于它的优势以及使用场景网上的资料非常多,这里我推荐大家去这个网站去详细学习docker. 我这里就写一下作为一名后端开发程序员,自己学习do ...

  7. 老外写的-用Rawrite神器写入u盘镜像-制作u盘启动- fedora -u盘安装制作

    用Rawrite神器写入u盘镜像? ====================================================== 尝试用ultraiso, 写入硬盘镜像, 不能启动,在 ...

  8. vundle的安装笔记-20160721

    vundle是一个vim管理插件, 而bundle是命令, 用来操作vundle的. bundle 英[ˈbʌndəl] 美[ˈbʌndəl] n. 捆,束,包:大量:一大笔钱:极度 v. 归拢:捆: ...

  9. Retrofit RestAdapter 配置说明

    RestAdapter.Builder builder = new RestAdapter.Builder();                    builder.setEndpoint(ip地址 ...

  10. 阶段1 语言基础+高级_1-3-Java语言高级_04-集合_05 List集合_2_Arraylist集合

    数组查询快,增删慢. 不是同步的就是多线程的 ArrayList其实就是一个数组 这是add方法 它在添加元素的时候会创建新的数组,然后把元素复制过来.这就是为什么查询快,增删们的原因. 每次增加元素 ...