标签:
base.js
/** * Created by zhouyan on 15/4/26. */ //前台调用 var $=function(_this){ return new Base(_this); } //基础库 function Base(_this){ //创建一个数组,来保存获取的节点和节点数组 this.elements=[]; if(_this != undefined){ this.elements[0]=_this; } //获取ID节点 this.getId=function(id){ this.elements.push(document.getElementById(id)); return this; }; //获取元素节点 this.getTagName=function(tagName){ var tags=document.getElementsByTagName(tagName); for(var i=0;i<tags.length;i++){ this.elements.push(tags[i]); } return this; }; //获取Class节点 this.getClass=function(className,idName){ var node = null; if(arguments.length == 2){ node = document.getElementById(idName); }else{ node = document; } var all=node.getElementsByTagName(‘*‘); for(var i=0;i<all.length;i++) { if (all[i].className == className) { this.elements.push(all[i]) } } return this; } } //设置css Base.prototype.css=function(attr,value){ for(var i=0;i<this.elements.length;i++) { if(arguments.length == 1){ return getStyle(this.elements[i],attr); } this.elements[i].style[attr] = value; } return this; } //设置innerHTML Base.prototype.html=function(str){ for(var i=0;i<this.elements.length;i++) { if(arguments.length == 0){ return this.elements[i].innerHTML; } this.elements[i].innerHTML = str; } return this; } //触发点击事件 Base.prototype.click=function(fn){ for(var i=0;i<this.elements.length;i++) { this.elements[i].onclick=fn; } return this; } //获取某一个节点 Base.prototype.getElement =function(num){ var element =this.elements[num]; this.elements = []; this.elements[0] =element; return this; } //添加Class Base.prototype.addClass = function(className){ for(var i=0;i<this.elements.length;i++){ if(!hasClass(this.elements[i],className)) { this.elements[i].className += ‘ ‘+className; } } return this; } //移除Class Base.prototype.removeClass = function(className){ for(var i=0;i<this.elements.length;i++){ if(hasClass(this.elements[i],className)) { this.elements[i].className=this.elements[i].className.replace(new RegExp(‘(\\s|^)‘+className+‘(\\s|$)‘),‘‘); } } return this; } //添加link或style的css规则 Base.prototype.addRule = function(num,selectorText,cssText,pos){ var sheet = document.styleSheets[num]; insertRule(sheet,electorText,cssText,pos); return this; } //移除link或style的css规则 Base.prototype.removeRule = function(num,pos){ var sheet = document.styleSheets[num]; deleteRule(sheet,pos); return this; } //设置鼠标移入移出方法 Base.prototype.hover = function(over,out){ for(var i=0;i<this.elements.length;i++){ this.elements[i].onmouseover=over; this.elements[i].onmouseout=out; } return this; } //设置显示 Base.prototype.show =function(){ for(var i=0;i<this.elements.length;i++){ this.elements[i].style.display="block"; } return this; } //设置隐藏 Base.prototype.hide =function(){ for(var i=0;i<this.elements.length;i++){ this.elements[i].style.display="none"; } return this; } //设置物体居中 Base.prototype.center = function(width,height){ var top = (document.documentElement.clientHeight - height)/2; var left = (document.documentElement.clientWidth - width)/2; for(var i=0;i<this.elements.length;i++){ this.elements[i].style.top=top+‘px‘; this.elements[i].style.left=left+‘px‘; } return this; } //触发浏览器窗口事件 Base.prototype.resize = function(fn){ window.onresize=fn; return this; } //锁屏功能 Base.prototype.lock = function(){ for(var i=0;i<this.elements.length;i++){ this.elements[i].style.display=‘block‘; this.elements[i].style.width=getInner().width+‘px‘; this.elements[i].style.height=getInner().height+‘px‘; document.documentElement.style.overflow=‘hidden‘; } return this; } //解屏功能 Base.prototype.unlock = function(){ for(var i=0;i<this.elements.length;i++){ this.elements[i].style.display=‘none‘; document.documentElement.style.overflow=‘auto‘; } return this; } //拖拽功能 //拖拽流程 //1.先点下去 //2.再点下的物体被选中,进行move移动 //3.抬起鼠标,停止移动 //点击某个物体,用Div即可,move和up是全局区域,也就是整个文档通用,应该用document Base.prototype.drag= function(){ for(var i=0;i<this.elements.length;i++){ this.elements[i].onmousedown = function(e){ var e=getEvent(e); var _this=this; var diffX= e.clientX- _this.offsetLeft; var diffY= e.clientY- _this.offsetTop; document.onmousemove = function(e){ var e=getEvent(e); _this.style.left= e.clientX-diffX+‘px‘; _this.style.top= e.clientY-diffY+‘px‘; } document.onmouseup= function(e){ this.onmousemove =null; this.onmouseup =null; } } } return this; }
tool.js
/** * Created by zhouyan on 15/4/27. */ //跨浏览器获取视口大小 function getInner(){ if(typeof window.innerWidth != ‘undefined‘){ return { width: window.innerWidth, height: window.innerHeight } }else{ return { width: document.documentElement.clientWidth, height: document.documentElement.clientHeight } } } //跨浏览器获取Style function getStyle(element,attr){ if(typeof window.getComputedStyle !="undefined"){//W3C return window.getComputedStyle(element,null)[attr]; }else if(typeof this.elements[i].currentStyle != ‘undefined‘){//IE return element.currentStyle[attr]; } } //判断Class是否存在 function hasClass(element,className){ element.className.match(new RegExp(‘(\\s|^)‘+className+‘(\\s|$)‘)); } //跨浏览器添加link规则 function insertRule(sheet,selectorText,cssText,pos){ if(typeof sheet.insertRule != ‘undefined‘){ //w3c sheet.insertRule(selectorText+‘{‘+cssText+‘}‘,pos); }else if(typeof sheet.addRule != ‘undefined‘){ //Ie sheet.addRule(selectorText,cssText,pos); } } //跨浏览器删除link规则 function deleteRule(sheet,pos){ if(typeof sheet.deleteRule != ‘undefined‘){ //w3c sheet.deleteRule(pos); }else if(typeof sheet.removeRule != ‘undefined‘){ //Ie sheet.removeRule(pos); } } //获取Event对象 function getEvent(event){ return event|| window.event; }
标签:
原文地址:http://www.cnblogs.com/serene92/p/4461506.html