JS中一些常用的兼容写法

1.滚动条到顶端的距离
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
2.滚动条到左端的距离
var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
3.通过class属性获取页面元素对象的兼容
function byClassName(obj,className){
         if(obj.getElementsByClassName){
return obj.getElementsByClassName(className);
         }else{
     var arr = [];
        var eles = obj.getElementsByTagName(‘*‘);
  for(var i = 0; i < eles.length; i++){
     if(eles[i].className === className){
    arr.push(eles[i]);
        }
    }
   return arr;
 }
}
4.获取非行内样式的兼容
function getStyle(obj,attr){
return obj.currentStyle ? obj.currentStyle[attr] : window.getComputedStyle(obj.1)[attr];
}
5.获取事件对象的兼容
var e = event || window.event;
6.获取鼠标编码值的兼容
function getButton(event){
 var e = event || window.event;
if(event){
    return e.button;
}else if(window.event){
   switch(e.Button){
      case 1 : return 0;
      case 4 : return 1;
      case 2 : return 2;
     }
   }
}
七,获取键盘编码值的兼容
var code = event.keyCode || event.charCode || event.which;
八.阻止时间冒泡的兼容
event.stopPropagation ? event.stopPropagation() : event.cancelBubble = true;
九,阻止超链接的默认行为
event.preventDefault ? event.preventDefault() : event.returnValue = false;
十,添加时间监听器
function addEventListener(obj,event,fn,boo){
             if(obj.addEventListener){ 
          obj.addEventListener(event,fn,boo);
             }else if(obj.attachEvent){
          obj.attachEvent(‘on‘ + event,fn);
     }
}
十一,移除时间监听器
function removeEventListener(obj,event,fn,boo){
                 if(obj.removeEventListener){
                obj.removeEventListener(event,fn,boo);
                   }else if(obj.detachEvent){
                obj.detachEvent(‘on‘ + event,fn)
            }
      }
十二,获取事件源的兼容
var target = e.target || e.srcElement;

原文地址:https://www.cnblogs.com/arguments/p/10319841.html

时间: 2024-10-18 05:31:03

JS中一些常用的兼容写法的相关文章

js中字符串常用熟悉和方法

for(var i=0;i<=450;i++){ for(var j=380-i;j+i<=450 && j+i>=380;j++){ if((i*75+j*80.1)==(i+j)*76){ alert('nan:'+i+'nv:'+j); } } } js中字符串常用熟悉和方法,布布扣,bubuko.com

JS中一些常用的事件(笔记)

window.onload事件:当文档和其所有外部资源(如图片)完全加载并显示给用户时就会触发它. window.onload = function (){ //当加载完当前页面和其所有外部资源(如图片)后,执行这个函数 } window.onunload事件:当用户离开当前页面时会触发该事件 window.onunload = function (){ //离开该页面时执行该函数 } event对象:该对象代表了当前事件的状态,并且只有在事件发生的过程中才生效.对象中存放的是键盘按键的状态.鼠

JS中一些常用的内置对象

在JS中,经常会遇到明明知道一个对象有某个属性或方法,可是又不知道怎么写的情况.下面,我就罗列了一些JS中常用的内置对象的属性和方法. Math对象: Math对象的作用是执行常见的算术任务. 首先Math属性中最常用的属性就是PI了,我们一般用Math.PI来调用它.在控制台中输出它的值为3.141592653589793,也就是圆周率.Math对象的常用的属性主要就是PI了,其他的用的比较少,如果用的时候直接查手册就好了. 然后就要说说它的方法了,Math的内置对象还是挺多的,不过都比较简单

js中(function(){…})()立即执行函数写法理解

javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解. ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到函数定义后立即执行的目的,后来发现加括号的原因并非如此.要理解立即执行函数,需要先理解一些函数的基本概念.

js中奇特的for循环写法

//正常的for循环 for(var i=0;i<10;i++){ console.log(i); } //输出:1,2,3……10 //简写 for(var i=10;i--;){ console.log(i); } //输出:9,8,7,……0 //变种: for(var i=-10;i++;){ console.log(i*-1); } //输出:9,8,7,……0 因为在js中,0,null,undefined,false,'',""作为条件判断时,其结果为false i

JS中的常用的代码操作

本文件介绍常用的js代码的DOM操作.CSS操作.对象(Object对象.Array对象.Number对象.String对象.Math对象.JSON对象和Console对象)操作说明. 一.DOM树的节点 DOM节点分为三大类: 元素节点(标签节点).属性节点和文本节点. 属性节点和文本节点都属于元素节点的子节点. 因此操作时,需先选中元素节点,再修改属性和文本. [查看元素节点] 1. 使用getElement系列方法: 具体的HTML代码如下图: //通过ID来查看元素属性 var li =

JS中一些常用的代码块

本文记录了一些工作中常用到的js代码. 1. 生成指定范围内的随机数 例如随机获取颜色rgba的参数值时 function setRandomNum(m,n){ return Math.floor(Math.random()*(n-m+1)) + m; } 2. json转url参数 当进行http请求,可能需要把json转化为url参数 function json2url(json) { var arr = []; for(var name in json) { arr.push(name+'

JS 中面向对象的5种写法和拓展JS对象的写法

面向对象的JAVA  最开始当然是对象的定义了 收集了以下的五种写法 //第1种写法 function Circle(r) { this.r = r; } Circle.PI = 3.14159; Circle.prototype.area = function() { return Circle.PI * this.r * this.r; } var c = new Circle(1.0); alert(c.area()); //第2种写法 var Circle = function() {

熟悉JS中的常用选择器及属性、方法的调用

选择器.属性及方法调用的配合使用: <style>            #a{                width: 200px;                height: 100px;                background-color: red;                            }            .b{                width: 200px;                height: 100px;