DOM加载已经做好了，我们需要将他封装到Base中去，然后调用的时候直接通过$(function(){})将需要在dom解析后运行的代码放入圆括号函数中。

封装到Base基础库中

function Base(args) {
    this.arr = [];
    if(typeof args == 'string') {
        if(args.indexOf(' ') != -1){
            var childNodes = args.split(' ');
            var temNodes = [];
            var node = []; 
            for(var i = 0;i < childNodes.length;i++) {
                if(node.length == 0) node.push(document);
                switch(childNodes[i].charAt(0)) {
                    case '#' :
                        temNodes = [];
                        temNodes.push(this.getId(childNodes[i].substring(1)));
                        node = temNodes;
                        break;
                    case '.' :
                        temNodes = [];
                        for(var j = 0;j<node.length;j++) {
                            var temps = this.getclass(childNodes[i].substring(1),node[j]);
                            for(var k = 0;k<temps.length;k++){
                                temNodes.push(temps[k])
                            }
                        }
                        node = temNodes;                    
                        break;
                    default :
                        temNodes = [];
                        for(var j = 0;j<node.length;j++) {
                            var temps = this.getTagName(childNodes[i],node[j]);
                            for(var k = 0;k<temps.length;k++){
                                temNodes.push(temps[k])
                            }
                        }            
                        node = temNodes;
                }            
            }
            this.arr = temNodes;
        }else {
            switch(args.charAt(0)) {
                case '#' :
                    this.arr.push(this.getId(args.substring(1)));
                    break;
                case '.' :
                    this.arr = this.getclass(args.substring(1));
                    break;
                default :
                    this.arr = this.getTagName(args);
            }
        }
    }else if(typeof args == 'object') {
        if(args != undefined) {
            this.arr[0] = args;
        }
    }else if(typeof args == 'function') {
        this.ready(args);
    }        
}

else if判断如果传入的是function，就使用ready的方法运行这个方法，这个ready就是Base原型中的方法，这个方法要运行传入的args，或者单独使用的时候运行传入的其他function。

ready()方法封装addDomloaded

Base.prototype.ready = function(fn) {
    addDomLoaded(fn);
}

筛选节点的一些方法：

//筛选节点，并返回指定节点
Base.prototype.getElemet = function(num) {
    return this.arr[num];
}

//筛选节点，并返回Base对象
Base.prototype.getElementBase = function(num) {
    var element = this.arr[num];
    this.arr = [];
    this.arr[0] = element;
    return this;
}

//筛选节点，返回第一个节点
Base.prototype.first = function() {
    return this.arr[0];
}

//筛选节点，返回最后一个节点
Base.prototype.last = function() {
    return this.arr[this.arr.length - 1];
}

拖拽登录框修缮

之前设置了一个触发条件，通过数组里面进行传入筛选的条件，但是我们已经可以通过$(‘#id .class tagName’)的方式直接获取节点，不需要像之前那样传入一个document.getElementById(‘xxx’)的方式，数组也不需要了，直接

//拖拽登录框
    $('#login').drag($('#login_title').first(),$('#login .other').last(0));

通过筛选的方法返回对应的节点，那么原来的拖拽的插件需要稍微修改一下。

//拖拽功能
 $().extend('drag',function(){
    var tags = arguments;  //不设置传入的参数名，直接通过arguments获取，然后将for循环的tags等于这个arguments即可。
    for(var i = 0;i<this.arr.length;i++)  {
        addEvent(this.arr[i],'mousedown',function(e) {
            if(removeSpen(this.innerHTML).length == 0) e.preventDefault();
            var _this = this;
            var cleft = e.clientX - _this.offsetLeft;
            var ctop = e.clientY - _this.offsetTop;
            var flag = false;
            for(var i = 0;i<tags.length;i++){
                if(e.target === tags[i]) {
                    flag = true;
                    break;
                }
            }
            if(flag) {
                addEvent(document,'mousemove',move);
                addEvent(document,'mouseup',up)
            }
            function move(e) {
                var left = e.clientX - cleft;
                var top = e.clientY - ctop;
                if(left < 0) {
                    left = 0;
                }else if(left > getInner().width - _this.offsetWidth) {
                    left = getInner().width - _this.offsetWidth;
                }
                if(top < 0) {
                    top = 0;
                }else if(top > getInner().height - _this.offsetHeight) {
                    top = getInner().height - _this.offsetHeight;
                }
                _this.style.top =  top + 'px';
                _this.style.left = left + 'px';
                if(typeof _this.setCapture != 'undefined') {
                    _this.setCapture();
                }
            }
            function up() {
                removeEvent(document,'mousemove',move);
                removeEvent(document,'mouseup',up);
                if(typeof _this.releaseCapture != 'undefined'){
                    _this.releaseCapture();
                }
            }
            function removeSpen(html){
                return html.replace(/(^\s*)|(\s*$)/g,'');
            }
        });
    }
    return this;
});

重新调整一下之前的调用函数：

$(function(){
    //个人设置
    $('#header .nav-confin').hover(function(){
            $(this).css('background-color','rgba(0,0,0,.3)');
            $('#header .nav-menu').css('height','120px');
        },function(){
            $(this).css('background-color','rgba(0,0,0,0)');
            $('#header .nav-menu').css('height','0');
        });
    $('#header .menu-li').hover(function(){
            $(this).css('background-color','rgba(0,0,0,.3)');
        },function(){
            $(this).css('background-color','rgba(0,0,0,0)');
        });
    //弹出登录框   
    $('#header .nav-login').hover(function(){
        $(this).css('background-color','rgba(0,0,0,.3)');
        },function() {
            $(this).css('background-color','rgba(0,0,0,0)');
        });
    $('#header .nav-login').click(function(){
        $('#login').css('clip','auto').css('opacity','1').center().Masked().resize(function(){
            if($('#login').css('opacity') == '1'){
                $('#login').Masked();
            };
        });
        $('html').css('overflow','hidden');
    });
    $('#login .login_off').click(function(){
        $('#login').css('clip','rect(0 0 0 0)').css('opacity','0').removeMasked();
        $('html').css('overflow','');
    });
    //拖拽登录框
    $('#login').drag($('#login_title').first(),$('#login .other').last(0));
    
});