1 var DOMextend=function(name,fn){ 2     if(!document.all){ 3         eval("HTMLElement.prototype."+name+"=fn"); 4     } 5     else{ 6         var _createElement=document.createElement; 7         document.createElement=function(tag){ 8             var _elem=_createElement(tag); 9             eval("_elem."+name+"=fn");10             return  _elem;11         }12         var _getElementById=document.getElementById;13         document.getElementById=function(id){14             var _elem=_getElementById(id);15             eval("_elem."+name+"=fn");16             return  _elem;17         }18         var _getElementsByTagName=document.getElementsByTagName;19         document.getElementsByTagName=function(id){20             var _arr=_getElementsByTagName(id);21             for(var i=0;i<_arr.length;i++){22                 eval("_arr[i]."+name+"=fn");23             }24             return  _arr;25         }26     }27         28 }

 1 DOMextend("getStyle",function(n){ 2     var _this=this; 3     if(_this.style[n]){ 4         return _this.style[n]; 5     }else if(_this.currentStyle){ 6         return _this.currentStyle[n]; 7     } 8     else if(document.defaultView &&document.defaultView.getComputedStyle){ 9         n=n.replace(/(A-Z)/g,"-$1");10         n=n.toLowerCase();11         var s=document.defaultView.getComputedStyle(_this,null);12         if(s){13             return s.getPropertyValue(n);14         }15         16     }17     else return null;18 })

 1 DOMextend("setOpacity",function(n){ 2         //n为要设置的透明度 3         var _this=this; 4         var n=parseFloat(n);//将n转化为浮点数 5         if(n && (n>100) ||!n) n=100; 6         if((n<0) && n) n=0; 7         //_this.filters ? '_this.style.filter=(alpha='+n+')':'_this.style.opacity='+n/100; 8         if(_this.filters){//兼容IE浏览器 9             _this.style.filter='(alpha='+n+')';10         }11         else{//兼容非IE浏览器12             _this.style.opacity=n/100;13         }14         15     })

 1 DOMextend("fadeIn",function(time,fn){//自定义逐渐显示的动画方法 2         var _this=this; 3         var isShow=_this.getStyle("display");//调用getStyle方法，判断当前元素是否隐藏 4         if(!isShow=="none"){ 5             return; 6         } 7         var t=5;//设置定时器步长为5秒 8         var step=t*100/time; 9         var i=0;10         //为当前元素包裹一个克隆元素，以防止元素在演示过程中突然闪现的问题11         var box=_this.cloneNode(true);12         for(var i=0;i<box.length;i++){//清楚所有子节点13             box.removeChild(box.childNodes[i]);14         }15         _this.parentNode.insertBefore(box,_this);//把克隆元素插入到当前元素前面16         _this=_this.parentNode.removeChild(_this);//删除当前元素17         box.appendChild(_this);//把当前元素添加到盒子元素中18         box.style.display="";//显示盒子元素19         box.setOpacity(0);//设置盒子元素不透明度为020         box.style.visibility="hidden";//设置盒子的元素不可见21         _this.style.display="";//显示当前元素，由于盒子元素不显示，故也看不到22         var interval=setInterval(function(){//设置定时器23             box.style.visibility="visible";//设置盒子元素可见24             box.setOpacity(i);//设置盒子元素的不透明度25             i+=step;//增加步长26             if(i>=100){//如果步长大于或等于100，则退出定时器27                 clearTimeout(interval);//清楚定时器28                 _this=_this.parentNode.removeChild(_this);//移出当前元素29                 box.parentNode.insertBefore(_this,box);//把当前元素插入到克隆盒子的前面30                 box.parentNode.removeChild(box);//移出克隆的盒子31                 if(fn) //如果存在回调函数则调用32                     fn();33             }34         },t)35     })

 1 DOMextend("fadeOut",function(time,fn){ 2         var _this=this; 3         var isShow=_this.getStyle("display"); 4         if(isShow=="none"){ 5             return; 6         } 7         var t=5; 8         var step=t*100/time; 9         var i=100;10         var interval=setInterval(function(){11             _this.setOpacity(i);12             i-=step;13             if(i<=0){14                 clearTimeout(interval);15                 _this.style.display="none";16             }17             if(fn) fn();18         },t)19     })