简易封装js库
function myAddEvent(obj, sEv, fn) //事件绑定
{
if(obj.attachEvent)
{
obj.attachEvent('on' + sEv, function(){
if(false==fn.call(obj))
{
event.cancelBubble=true;
return false;
};
});
}
else
{
obj.addEventListener(sEv, function(ev){
if(false==fn.call(obj))
{
ev.cancelBubble=true;
ev.preventDefault();
};
}, false);
}
};
function getByClass(oParent, sClass) //用class选取元素
{
var aEle=oParent.getElementsByTagName('*');
var aResult=[];
var i=0;
for(i=0; i<aEle.length; i++)
{
if(aEle[i].className == sClass)
{
aResult.push(aEle[i]);
}
}
return aResult;
};
function getStyle(obj, attr) //获取样式
{
if(obj.currentStyle)
{
return obj.currentStyle[attr];
}
else
{
return getComputedStyle(obj, false)[attr];
}
};
function VQuery(vArg)
{
this.elements=[]; //用来保存选中的元素
switch(typeof vArg)
{
case 'function': //传过来的如果是个函数
myAddEvent(window,'load',vArg);
break;
case 'string': //传过来的如果是字符串类型
switch(vArg.charAt(0))
{
case '#': //ID
var obj=document.getElementById(vArg.substring(1));
this.elements.push(obj);
break;
case '.': //class
this.elements=getByClass(document, vArg.substring(1));
break;
default: //tagName
this.elements=document.getElementsByTagName(vArg);
}
break;
case 'object':
this.elements.push(vArg);
break;
}
};
VQuery.prototype.click=function (fn)
{
var i=0;
for(i=0; i<this.elements.length; i++)
{
myAddEvent(this.elements[i], 'click', fn);
}
return this;
};
VQuery.prototype.show=function()
{
var i=0;
for(i=0; i<this.elements.length; i++)
{
this.elements[i].style.display = 'block';
}
return this;
};
VQuery.prototype.hide=function()
{
var i=0;
for(i=0; i<this.elements.length; i++)
{
this.elements[i].style.display = 'none';
}
return this;
};
VQuery.prototype.hover=function (fnOver, fnOut)
{
var i=0;
for(i=0; i<this.elements.length; i++)
{
myAddEvent(this.elements[i], 'mouseover', fnOver);
myAddEvent(this.elements[i], 'mouseout', fnOut);
}
return this;
};
VQuery.prototype.css=function(attr, value)
{
if(arguments.length==2) //设置样式
{
var i = 0;
for(i=0; i<this.elements.length; i++)
{
this.elements[i].style[attr]=value;
}
}
else //获取样式
{
if(typeof attr=='string')
{
return getStyle(this.elements[0], attr);
}
else
{
for(i=0;i<this.elements.length;i++)
{
var k='';
for(k in attr)
{
this.elements[i].style[k]=attr[k];
}
}
}
}
return this;
};
VQuery.prototype.toggle=function()
{
var i =0;
var _arguments=arguments; //存在arguments为了防止调用addToggle获取不到arguments
for(i=0; i<this.elements.length; i++)
{
addToggle(this.elements[i]);
}
function addToggle(obj)
{
var count=0;
myAddEvent(obj, 'click', function(){
_arguments[count++ % _arguments.length].call(obj);
});
}
return this;
};
VQuery.prototype.attr=function(attr, value)
{
if(arguments.length==2)
{
var i=0;
for(i=0; i<this.elements.length; i++)
{
this.elements[i][attr]=value; //设置属性
}
}
else
{
return this.elements[0][attr]; //返回属性
}
return this;
};
VQuery.prototype.eq=function(n)
{
return $(this.elements[n]);
}
function appendArr(arr1, arr2)
{
var i=0;
for(i=0; i<arr2.length; i++)
{
arr1.push(arr2[i]);
}
}
VQuery.prototype.find=function(str)
{
var i=0;
var aResult=[];
for(i=0; i<this.elements.length; i++)
{
switch(str.charAt(0))
{
case '.': //class
var aEle=getByClass(this.elements[i], str.substring(1));
aResult=aResult.concat(aEle);
break;
default: //标签
var aEle=this.elements[i].getElementsByTagName(str);
appendArr(aResult,aEle);
}
}
var newVquery=$();
newVquery.elements=aResult;
return newVquery;
};
function getIndex(obj)
{
var aBrother=obj.parentNode.children;
var i=0;
for(i=0; i<aBrother.length; i++)
{
if(aBrother[i]==obj)
{
return i;
}
}
}
VQuery.prototype.index=function()
{
return getIndex(this.elements[0]);
}
function $(vArg)
{
return new VQuery(vArg);
};
VQuery.prototype.bind=function(sEv, fn)
{
var i=0;
for(i=0;i<this.elements.length;i++)
{
myAddEvent(this.elements[i], sEv, fn);
}
};
VQuery.prototype.extend=function(name, fn)
{
VQuery.prototype[name]=fn;
}
$().extend('size', function(){
return this.elements.length;
});
$().extend('animate', function(json){
var i=0;
for(i=0; i<this.elements.length; i++)
{
startMove(this.elements[i], json);
}
});
//运动框架
function getStyle(obj,attr){
if(obj.currentStyle){
return obj.currentStyle[attr];
} else{
return getComputedStyle(obj,false)[attr];
}
};
function startMove(obj,json,fn){
clearInterval(obj.timer);
obj.timer = setInterval(function(){
var bStop=true; //这一次运动就结束了,所有值都到达了。
for(var attr in json){
//1.取当前的值
var iCur=0;
if(attr == 'opacity'){
iCur=parseInt(parseFloat(getStyle(obj,attr))*100);
} else{
iCur=parseInt(getStyle(obj,attr));
}
//2.算速度
var iSpeed=(json[attr]-iCur)/8;
iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed);
//3.检测停止
if(iCur!=json[attr]){
bStop=false;
}
if(attr=='opacity'){
obj.style.filter='alpha(opacity:'+(iCur+iSpeed)+')';
obj.style.opacity=(iCur+iSpeed)/100;
} else{
obj.style[attr]=iCur+iSpeed+'px';
}
}
if(bStop){
clearInterval(obj.timer);
if(fn){
fn();
}
}
},30)
}
//运动框架结束