• 简易封装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)
    }

    //运动框架结束

  • 相关阅读:
    【LeetCode】241. Different Ways to Add Parentheses
    【LeetCode】240. Search a 2D Matrix II
    【LeetCode】239. Sliding Window Maximum
    【LeetCode】238. Product of Array Except Self
    【LeetCode】237. Delete Node in a Linked List
    【Babble】批量学习与增量学习、稳定性与可塑性矛盾的乱想
    【LeetCode】233. Number of Digit One
    【LeetCode】236. Lowest Common Ancestor of a Binary Tree
    MySQL存储过程
    mysql远程连接/访问速度慢的解决方案
  • 原文地址:https://www.cnblogs.com/qibingshen/p/5392445.html
Copyright © 2020-2023  润新知