JavaScript的兼容

时间:2022-09-26 08:56:02

兼容总结


  • 如果两个都是属性,用逻辑 || 做兼容
  • 如果有一个是方法,用三元做兼容
  • 如果多个属性或方法,封装函数做兼容

获取class属性值的兼容

function getClass (obj){
if(obj.getAttribute("class") == null){
return (obj.getAttribute("className")
}else{
return (obj.getAttribute("class")
}
}

获取className兼容

function byClassName (className){
if(document.getElementsByClassName){
return document.getElementsByClassName(className);
}else{
var arr = [];
var ele = document.getElementsByTanName("*");
for(var i = 0; i < ele.length; i++){
if(ele[i].className == className){
arr.push(ele[i]);
}
}
return arr;
}
}

滚动高度兼容

 var scrollTop = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;

获取非行内样式的兼容

function getStyle(obj,attr){
return obj.currentStyle ? obj.currentStyle[attr] : getConputedStyle(obj,1)[attr];
}

获取事件Event兼容

oBtn.onclick = function(event){
event = event || window.event;
}

键盘值的兼容

function key(evt){
var e = evt || window.event
var keyvalue = e.getCode || e.charCOde || e.which;
return keyvalue;
}

阻止事件冒泡

function stop (e){
var e = e || window.event;
return e.stopPropagtion ? e.stopPropagtion() : e.cancelBubble = true;
}

阻止超链接的默认行为

oA.onclick = function (e){
var e = e || window.event;
e.preventDefault ? e.preventDefault() : e.returnValue = false;
}

事件源委托兼容

function target(evt){
var e = evt || window.event;
var target = e.target || e.srcElement;
return target;
}

获取鼠标值的兼容

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

添加事件的兼容

function addEventListener(obj,evt,fn,boo){
if(obj.addEventListener){
obj.addEventListener(evt,fn,boo);
}else{
obj.attachEvent("on" + evt , fn);
}
}

移除事件的兼容

function removeEventListener(obj,evt,fn,boo){
if(obj.removeEventListener){
obj.removeEventListener(evt,fn,boo);
}else{
obj.detachEvent("on" + evt , fn);
}
}

JavaScript的兼容的更多相关文章

  1. JavaScript XML 兼容处理,序列化和反序列化以及回调事件

    浏览器中XML DOM的支持 IE中通过ActiveXObject实现了XML的支持,存在一下几个版本:Microsoft.XmlDom,MSXML2.DOMDocument,MSXML2.DOMDo ...

  2. JavaScript的兼容小坑和调试小技巧

    JavaScript作为一种弱类型编程语言,入门简单,只要稍微注意一下IE方面的兼容性,就可以很好的使用它. 本文主要是对IE兼容的小坑和调试的小技巧进行举例分析,并给出解决方法. 1.var str ...

  3. javascript ie8兼容 a标签href javascript&colon;void&lpar;0&rpar;&semi;

    ie8兼容 a标签href javascript:void(0); 尽量不要用javascript:协议做为A的href属性,这样不仅会导致不必要的触发window.onbeforeunload事件;

  4. JavaScript js 兼容浏览器问题 兼容Fire

    做BS开发就难免会用到javascript,而每个浏览器对javascript的支持有不同.这就需要我们程序员去兼容他们,不然有些浏览器就无法运行我们的代码.就会造来客户的投诉,如果让BoSS知道了, ...

  5. javascript event兼容IE和FF

    事件对象在IE和FF下的兼容写法 function abc(event){ var e=event||window.event; //键盘码的捕获 var key=e.which||e.keyCode ...

  6. 简单实现 C&num; 与 Javascript的兼容

    本文章介绍下自己这刚实现的一个c#与js交互的插件.需求来源于一次与朋友的讨论.主要对话如下: 朋友:最近我想模拟一些数据,来测试我现在写的接口,但手工编写这些测试数据太麻烦了 本人:是啊,.net能 ...

  7. JavaScript文件下载 兼容所有浏览器 不可跨域

    前端文件下载 兼容所有浏览器 download.js文件下载,几乎支持所有类型下载,详细内容参考官网 http://danml.com/download.html 引入文件 <script sr ...

  8. javascript 常用兼容fire fox的解决办法

    常用兼容fire fox的解决办法 一.js不兼容:1.event不兼容,必须通过参数传递过来: function test(event){ //兼容fire fox var event = even ...

  9. 聊聊一直困扰前端程序员的浏览器兼容-【JavaScript】

    上篇已经写过浏览器的兼容发展历史以及主流浏览器,主要的css兼容我知道的已全部写到,这篇这篇专攻javascript的兼容. 1.getYear()方法 var year = new Date().g ...

随机推荐

  1. leetcode&lowbar;199 Binary Tree Right Side View

    题目: Given a binary tree, imagine yourself standing on the right side of it, return the values of the ...

  2. 工具篇-TraceView

    --- layout: post title: 工具篇-TraceView  description: 让我们远离卡顿和黑屏 2015-10-09 category: blog --- ## 让我们远 ...

  3. Spark技术内幕:Stage划分及提交源代码分析

    当触发一个RDD的action后.以count为例,调用关系例如以下: org.apache.spark.rdd.RDD#count org.apache.spark.SparkContext#run ...

  4. details和summary可以对内容进行折叠

    使用<details>和<summary>元素 它可以在body的任意地方使用下面有一个小例子 <!DOCTYPE html> <html lang=&quo ...

  5. DjangoRestFramework学习二之序列化组件、视图组件 serializer modelserializer

      DjangoRestFramework学习二之序列化组件.视图组件   本节目录 一 序列化组件 二 视图组件 三 xxx 四 xxx 五 xxx 六 xxx 七 xxx 八 xxx 一 序列化组 ...

  6. iOS-静态库,动态库,framework浅析&lpar;三&rpar;

    创建framework静态库 第一步,新建项目 新建项目.png 第二步,删除系统默认创建的[FMDB.h]和[FMDB.m]文件,导入需要打包的源文件. 导入源码后的工程.png 第三步,修改项目配 ...

  7. Python3 tkinter基础 Entry insert delete 点击按钮 向输入框赋值 或 清空

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  8. elasticsearch 自定义&lowbar;id

    elasticsearch 自定义ID: curl -s -XPUT localhost:9200/web -d ' { "mappings": { "blog&quot ...

  9. uoj318 &lbrack;NOI2017&rsqb;蔬菜 【贪心 &plus; 堆 &plus; 并查集】

    题目链接 uoj 题解 以前看别人博客,在考场上用费用流做,一直以为这题是毒瘤网络流题 没想到竟然是贪心模拟题... 如果只有一个蔬菜呢?这就是一个经典的普及难度的贪心,正着推面临优先选择的困难,而逆 ...

  10. SolrJ案例实现搭建环境——(十五)

    案例