js的一些兼容融性问题
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的一些兼容融性问题的更多相关文章
- js event 事件兼容浏览器 ie不需要 event参数 firefox 需要
js event 事件兼容浏览器 ie不需要 event参数 firefox 需要 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...
- Js 日期选择,可以的一个页面中重复使用本JS日历,兼容IE及火狐等主流浏览器,而且界面简洁、美观,操作体验也不错。
<html> <head> <title>Js日期选择器并自动加入到输入框中</title> <meta http-equiv="con ...
- nodejs——js 实现webSocket 兼容移动端
nodejs——js 实现webSocket 兼容移动端 //服务器端 //npm install --save ws const express = require('express'); cons ...
- IE和firefox火狐在JS、css兼容区别
1.firefox不能对innerText支持. firefox支持innerHTML但却不支持innerText,它支持textContent来实现innerText,不过默认把多余的空格也保留了. ...
- JS/JQ常见兼容辅助插件
1.Respond.js Respond.js 是一个快速.轻量的 polyfill,用于为 IE6-8 以及其它不支持 CSS3 Media Queries 的浏览器提供媒体查询的 min-widt ...
- html5 video.js 使用及兼容所有浏览器
废话少说,直接开始 一.准备材料 video.js下载: http://www.videojs.com/ 二.代码 引入相关文件:(必须放在文件的开头,也是说一定要放在video标签之前) 贴入htm ...
- 加入收藏夹的js代码(求兼容chrome浏览器的代码)
从网上找了加入收藏夹的js代码,但不兼容chrome,不知道有没有兼容chrome的相关代码,希望有知道的告诉一下,谢谢! 代码如下 $("#id").click(function ...
- JS事件及其兼容用法
JavaScript与HTML之间的交互是通过事件实现的.事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间. 1.事件流:描述的是从页面中接收事件的顺序. IE提出的事件冒泡流:事件开始由最具体的 ...
- JS中的兼容问题总结
今天总结总结在JS里面遇到的兼容性问题 1.获取滚动距离的兼容性问题: document.documentElement.scrollTop || document.body.scrollTop ...
随机推荐
- Python 学习 —— 进阶篇(装饰器、类的特殊方法)
Python基础部分学完之后,在进入其OOP部分前,先理解一下其装饰器这种结构,其功能可类比于Java中的面向切面编程,下面参见具体实例: def log(f): def fn(x): print ' ...
- 循环引擎 greenlet 没有显式调度的微线程,换言之 协程
小结: 1. micro-thread with no implicit scheduling; coroutines, in other words. 没有显式调度的微线程,换言之 协程 2. 一个 ...
- oracle-sql脚本
select * from dba_users; create tablespace kyc_coo; create user kyc_coo identified by "123456&q ...
- 14Flutter StatefulWidget有状态组件、页面上绑定数据、改变页面数据、实现计数器功能、动态列表
/** * Flutter StatefulWidget有状态组件.页面上绑定数据.改变页面数据 * 在Flutter中自定义组件其实就是一个类,这个类需要继承StatelessWidget/Stat ...
- 时间戳 Date.parse()和dateObject.getTime()的区别
一. Date.parse() parse() 方法可解析一个日期时间字符串,并返回 1970/1/1 午夜距离该日期时间的毫秒数. 解析: 1.parse() 方法为Date 对象的静态方法,一般采 ...
- java+断点续传
在Web应用系统开发中,文件上传和下载功能是非常常用的功能,今天来讲一下JavaWeb中的文件上传和下载功能的实现. 先说下要求: PC端全平台支持,要求支持Windows,Mac,Linux 支持所 ...
- iOS-在AFN基础上进行网络请求的封装
网络请求的思路:如果请求成功的话AFN的responseObject就是解析好的. 1发送网络请求:get/post/或者别的 带上URL,需要传的参数 2判断后台网络状态码有没有请求成功: 3 请求 ...
- 申请 Let's Encrypt 通配符 HTTPS 证书
目录 一.背景知识 1.1.什么是通配符证书 1.2.什么是 Let's Encrypt 二.证书申请(certbot) 2.1.系统确定 2.2.工具安装 2.3.证书申请 2.4.证书查看 2.5 ...
- whereis which type find
1. whereis name whereis命令只能用于搜索程序名,而且只搜索二进制文件(参数-b).man说明文件(参数-m)和源代码文件(参数-s).如果省略参数,则返回所有信息. 2. wh ...
- (4)Linux命令分类汇总(13~16)
Linux命令分类汇总(13~16) (十三)系统管理与性能监视命令(9个) 79 chkconfig 管理Linux系统开机启动项. 80 vmstat 虚拟内存统计. 81 ...