1.非行内样式获取

    高级浏览器

   getComputedStyle(obox.false)//获取所有属性

    ie浏览器

  box.currentStyle//获取所有属性

    兼容写法

  function getStyle(ele,attr){//ele为获取元素,attr为属性。
       var a = "";
       if(ele.currentStyle){
           a = ele.currentStyle[attr];
       }else{
          a = getComputedStyle(ele,false)[attr];
       }
           return a;
       }

  2.事件冒泡的兼容

  高级浏览器

  e.stopPropagation()

  ie浏览器

  e.cancelBubble = true;

  兼容写法

   function stopBubble(e){
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble = true;
}
}

  3.阻止默认事件

  高级浏览器

 e.preventDefault()

  ie浏览器

 e.returnValue = false

  兼容写法

  function stopDefault(e){
if(e.preventDefault){
e.preventDefault()
}else{
e.returnValue = false;
}
  }

  4.DOM2级绑定事件

  高级浏览器

  obox.addEventListener("click",fn)

  ie浏览器

  obox.attachEvent("onclick",fn)

  兼容写法和删除兼容

//绑定兼容写法
addEvent(obox,"click",fn1)
function fn1(){
console.log()
}
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;
} }

//删除的兼容
removeEvent(obox,"click",fn1)
function removeEvent(ele,type,cb){
if(ele.removeEventListener){
ele.removeEventListener(type,cb)
}else if(ele.detachEvent){
ele.detachEvent("on"+type,cb)
} else{ele["on"+type] = null;
}
}

 6.ajax的兼容

  var xhr = new XMLHttpRequest() || new ActiveXObject("Microsoft,XMLHTTP");

 7.获取滚动条距离

var sTop = document.documentElement.scrollTop || document.body.scrollTop

 8.鼠标编码的兼容

function getButton(evt){
var e = evt || window.event;
if(evt){
return e.button;
}else if(window.event){
switch(e.button){
case : return ;
case : return ;
case : return ;
}
}
}

 9.获取键盘编码的兼容

evt.preventDefault ? evt.preventDefault() : evt.returnValue = false;

  

js的一些兼容融性问题的更多相关文章

  1. js event 事件兼容浏览器 ie不需要 event参数 firefox 需要

    js event 事件兼容浏览器    ie不需要 event参数   firefox 需要 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...

  2. Js 日期选择,可以的一个页面中重复使用本JS日历,兼容IE及火狐等主流浏览器,而且界面简洁、美观,操作体验也不错。

    <html> <head> <title>Js日期选择器并自动加入到输入框中</title> <meta http-equiv="con ...

  3. nodejs——js 实现webSocket 兼容移动端

    nodejs——js 实现webSocket 兼容移动端 //服务器端 //npm install --save ws const express = require('express'); cons ...

  4. IE和firefox火狐在JS、css兼容区别

    1.firefox不能对innerText支持. firefox支持innerHTML但却不支持innerText,它支持textContent来实现innerText,不过默认把多余的空格也保留了. ...

  5. JS/JQ常见兼容辅助插件

    1.Respond.js Respond.js 是一个快速.轻量的 polyfill,用于为 IE6-8 以及其它不支持 CSS3 Media Queries 的浏览器提供媒体查询的 min-widt ...

  6. html5 video.js 使用及兼容所有浏览器

    废话少说,直接开始 一.准备材料 video.js下载: http://www.videojs.com/ 二.代码 引入相关文件:(必须放在文件的开头,也是说一定要放在video标签之前) 贴入htm ...

  7. 加入收藏夹的js代码(求兼容chrome浏览器的代码)

    从网上找了加入收藏夹的js代码,但不兼容chrome,不知道有没有兼容chrome的相关代码,希望有知道的告诉一下,谢谢! 代码如下 $("#id").click(function ...

  8. JS事件及其兼容用法

    JavaScript与HTML之间的交互是通过事件实现的.事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间. 1.事件流:描述的是从页面中接收事件的顺序. IE提出的事件冒泡流:事件开始由最具体的 ...

  9. JS中的兼容问题总结

    今天总结总结在JS里面遇到的兼容性问题 1.获取滚动距离的兼容性问题: document.documentElement.scrollTop  ||  document.body.scrollTop ...

随机推荐

  1. C++ replace replace_if replace_copy replace_copy_if

    #include <iostream>#include <list>#include <algorithm>#include <iterator>#in ...

  2. Redis有序Set、无序Set的使用经历

    为了实现一个类似关系数据库中的卖家信息的单表,首先我们知道单表必然可增删查改,其次为了区分先来后到又需要有ID主键且自增长.开始考虑使用hash数据类型,因为hash是key+列1.列2...这样一来 ...

  3. Windows10 64位安装DB2数据库

    安装前准备 : 系统:Windows10 64位 DB2 v9.5下载地址(迅雷):http://big3.ddooo.com/db2_93661.rar 选择安装包解压位置,并复制记住: 去到解压的 ...

  4. zabbix 启动报错 cannot set resource limit: [13] Permission denied

    zabbix 启动报错 cannot set resource limit: [13] Permission denied 1.zabbix-server 启动报错 报错信息如下: ::140823. ...

  5. 深入理解java虚拟机---读书笔记

    第一章 走近java 1. java 技术体系: java 程序设计语言 各种硬件平台上的java虚拟机 class 文件格式 java API 类库 来自商业机构或者开源机构的第三方java类库 j ...

  6. 【Qt开发】【Gstreamer开发】Qt error: glibconfig.h: No such file or directory #include

    今天遇到一个问题如题 但是明明安装了 glib2.0和gtk,但是仍然找不到glibconfig.h,自己在/usr/include下找来也确实没有,然后只能在全盘搜啦 位置在: /usr/lib/x ...

  7. 巧用 Class Extension 隐藏属性

    一般来说,Extension用来给Class增加私有属性和方法,写在 Class 的.m文件.但是Extension不是必须要写在.m文件,你可以写在任何地方,只要在 @implementation  ...

  8. 冲刺Noip2017模拟赛4 解题报告——五十岚芒果酱

    题1 韬韬抢苹果(apple) [问题描述] 又到了收获的季节,树上结了许多韬韬,错了,是许多苹果,有很多个小韬韬都来摘苹 果.每个韬韬都想要最大的苹果,所以发生了争执,为了解决他们的矛盾,出题人定了 ...

  9. 洛谷 题解 P2676 【超级书架】

    题解 P2676 [超级书架] 这题就只是一个从大到小的排序而已,用"sort"函数 再用"while"判断奶牛塔的高度是否比书架高度要高 送上代码: #inc ...

  10. 编写一个自定义事件类,包含on/off/emit/once方法

    function Event() { this._events = {}; } Event.prototype.on = function(type, fn) { if (!this._events[ ...