一个类似JQuery的精简版框架

来源：互联网发布：标准曲线计算软件编辑：程序博客网时间：2024/05/16 11:40
最近看了一段关于javascript的视频，讲的是一个VQuery.js的框架，这是一个类JQuery框架的缩水版，里面有一些通用的方法，这里记录了下来。VQuery方法是这个框架主要的方法，它接收三种类型的参数，具体看下面代码。
VQuery.js代码：
function myAddEvent(obj, sEv, fn){    if(obj.attachEvent)    {//      obj.attachEvent('on'+sEv, fn);//ie上存在bug,当前对象会变为window;        obj.attachEvent('on'+sEv, function(){            fn.call(obj);        })    }else{        obj.addEventListener(sEv, fn, false);    }}function getByClass(oParent, sClass){    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 getComputedSytle(obj,false)[attr];    }}function VQuery(vArg){    //保存选取的对象    this.elements = [];    switch(typeof vArg)    {        case 'function':            window.onload = vArg;            break;        case 'string':            switch(vArg.charAt(0))            {                   case '#':                    var obj = document.getElementById(vArg.substring(1));                    this.elements.push(obj);                    break;                case '.':                    this.elements = getByClass(document, vArg.substring(1));                    break;                default:                    this.elements = document.getElementsByTagName(vArg);            }            break;        case 'object':            this.elements.push(vArg);    }}VQuery.prototype.click = function(fn){    var i = 0;    for(i = 0; i < this.elements.length; i++)    {        myAddEvent(this.elements[i],'click', fn);    }};VQuery.prototype.show=function(){    var i = 0;     for(i = 0; i < this.elements.length; i++)    {        this.elements[i].style.display = 'block';    }};//行间对象隐藏问题 例如spanVQuery.prototype.hide=function(){    var i = 0;     for(i = 0; i < this.elements.length; i++)    {        this.elements[i].style.display = 'none';    }}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);    }}VQuery.prototype.css=function(attr, value){    if(arguments.length == 2) //设置样式    {        var i = 0;        for(i = 0; i < this.elements.length; i++)        {            this.elements[i].sytle[attr] = value;        }    }else //获取样式    {        //sytle只能获取行间样式        //return this.elements[0].sytle[attr]        return getStyle(this.elements[i],attr);    }}VQuery.prototype.attr=function(attr, value){    alert(arguments.length)    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];    }}VQuery.prototype.toggle=function(){    var _arguments = arguments;    for(var 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);            });    }}VQuery.prototype.eq=function(n){    return $(this.elements[n]);}function appendArray(arr1, arr2){    for(var i = 0; i < arr2.length; i++)    {        arr1.push(arr2[i]);    }    return arr1;}VQuery.prototype.find=(str){    var i = 0;    var aResult = [];    for(i =0; i < this.elements.length; i++)    {        switch(str.charAt(0))        {            case ".":                var aEle = getByClass(this.elements[i],str.substring(1))                aResult = aResult.concat(aEle);                brea;            default:                //aEle不是数组，不能作为concat函数的参数                var aEle = this.elements.getElementsByTagName(str);                //aResult = aResult.concat(aEle);                appendArray(aResult, aEle);        }    }    var newVQuery = s();    newVQuery.elements = aResult;    return newVQuery;}function getIndex(obj){    var aBrother = obj.parentNode.children;    for(var i=0; i < aBrother.length; i++)    {        if(aBrother[i] == obj)        {            return i;        }    }}VQuery.prototype.index(){    return getIndex(this.elements[0]);}function $(vArg){    return new VQuery(vArg);}function addClass(obj, sClass) {     var aClass = obj.className.split(' ');    if (!obj.className) {        obj.className = sClass;        return;    }    for (var i = 0; i < aClass.length; i++) {        if (aClass[i] === sClass) return;    }    obj.className += ' ' + sClass;}function removeClass(obj, sClass) {     var aClass = obj.className.split(' ');    if (!obj.className) return;    for (var i = 0; i < aClass.length; i++) {        if (aClass[i] === sClass) {            aClass.splice(i, 1);            obj.className = aClass.join(' ');            break;        }    }}
0 0