javaScript常用工具库

//判断arr是否是一个数组，返回bool值
function isArray(arr){
    return Object.prototype.toString.call(arr)===‘[object Array]‘;
}

//判断fn是否是一个函数
function isFunction(fn){
    return Object.prototype.toString.call(fn)===‘[object Function]‘;
}

//判断一个值是否为假值
//js中有大量的假值，包括
//1:0
//2:Nan
//3:‘‘(空字符串)
//4:false
//5:null
//6:undefined
function isFalse(a){
    if(!a){
        return true;
    }
}

//判断是否是邮箱地址
function isEmail(a) {
    var reg=/^([\w_\.\-\+])+\@([\w\-]+\.)+([\w]{2,10})+$/;
    return reg.test(a);
}

//判断是否是电话号码
function isPhoneNumber(a){
    var reg=/^1\d{10}$/;
    return reg.test(a);
}

 

//判断元素是否包含某个类
function hasClass(element, className) {
    var oldClass = element.className;
    if (!oldClass) {
        return false;
    }
    var oldClassArr = oldClass.split(/\s+/);
    for (var i = 0, len = oldClass.length; i < len; i++) {
        if (oldClassArr[i] === className) {
            return true;
        }
    }
    return false;
}

//为元素增添一个新样式类
function addClass(element, newClassName) {
    if (hasClass(newClassName)) {
        return;
    }

    element.className = element.className ? [element.className, newClassName].join(‘ ‘) : newClassName;
}

//移除元素element中的样式oldClassName
function removeClass(element, oldClassName) {
    if (!hasClass(element, oldClassName)) {
        return;
    }
    var oldClassArr = element.className.split(/\s+/);
    for (var i = oldClassName.length - 1; i >= 0; i--) {
        if (oldClassArr[i] === oldClassName) {
            oldClassArr.splice(i, 1);
            break;
        }
    };
    element.className = oldClassArr.join(‘ ‘);
}

//判断siblingNode和element是否为同一个父元素下的同一级的元素，返回bool值
function isSiblingNode(elem, siblingNode) {
    return elem.parentNode === siblingNode.parentNode;
}

//实现一个简单的jquery,可以实现$(‘#adom‘),$(a),$(‘.aclass‘),$(‘[data-log]‘),$(‘[data-time=2015]‘),$(‘#adom .classA‘)
function $(selector) {
    var regExps = {
        id: /^#([\w_\-]+)/,
        className: /^\.([\w_\-]+)/,
        tag: /^\w+$/,
        attribute: /(\w+)?\[([^=\]]+)(?:=(["‘])?([^\]"‘]+)\3?)?\]/
    };
    var queryActions = {
        id: function(id) {
            return document.getElementById(id);
        },
        tag: function(tag) {
            return document.getElementsByTagName(tag);
        },
        className: function(className) {
            var elems = document.getElementsByTagName(‘*‘);
            var result = [];
            for (var i = 0, len = elems.length; i < len; i++) {
                if (hasClass(elems[i], className)) {
                    result.push(elems[i]);
                }
            }
            return result;
        },
        attribute: function(tag, key, value) {
            var elems = document.getElementsByTagName(tag || ‘*‘);
            var result = [];
            for (var i = 0, len = elems.length; i < len; i++) {
                if (elems[i].getAttribute(key)) {
                    if (!value) {
                        result.push(elems[i]);
                    } else if (elems[i].getAttribute(key).toLowerCase() === value.toLowerCase()) {
                        result.push(elems[i]);
                    }
                }
            }
            return result;
        }

    };
    //准备函数以及对应的参数
    function direct(part, actions) {
        var fn, result;
        var params = [];
        if (result = part.match(regExps[‘id‘])) {
            fn = ‘id‘;
            params.push(result[1]);
        }
        if (result = part.match(regExps[‘tag‘])) {
            fn = ‘tag‘,
                params.push(result[0]);
        }
        if (result = part.match(regExps[‘className‘])) {
            fn = ‘className‘,
                params.push(result[1]);
        }
        if (result = part.match(regExps[‘attribute‘])) {
            fn = ‘attribute‘,
                params.push(result[1], result[2], result[4]);
        }
        if (arguments[2]) {
            params.push(arguments[2]);
        }
        var elemResult = actions[fn].apply(null, params);
        return elemResult;
    }

    var parentActions = {
        id: function(idText, parentNode) {
            if (parentNode.getAttribute(‘id‘) === idText) {
                return true;
            } else {
                return false;
            }
        },
        className: function(classText, parentNode) {
            if (hasClass(parentNode, classText)) {
                return true;
            } else {
                return false;
            }
        },
        tag: function(tagText, parentNode) {
            if (parentNode.nodeName.toLowerCase() === tagText.toLowerCase()) {
                return true;
            } else {
                return false;
            }
        },
        attribute: function(tag, key, value, parentNode) {
            if (tag) {
                if (parentNode.nodeName.toLowerCase() !== tag.toLowerCase()) {
                    return false;
                }
            }
            if (parent.getAttribute(key)) {
                if (!value) {
                    return true;
                }
                if (parent.getAttribute(key) === value) {
                    return true;
                }
            }
            return false;
        }

    };

    function filterParents(parts, queryArr) {
        var result = [];
        var pText = parts.pop();
        //首先检验当前第一个父元素文本
        for (var i = queryArr.length - 1; i >= 0; i--) {
            var curPNode = queryArr[i].parentNode;
            while (curPNode) {
                if (direct(pText, parentActions, curPNode) === true) {
                    //说明该层匹配成功
                    result.push(queryArr[i]);
                    break;
                }
                curPNode = curPNode.parentNode;
            }

            return result[0] && parts[0] ? filterParents(parts, result) : result;
        };
    }

    //console.log(selector);
    var parts = selector.split(/\s+/);
    //对于非组合的情况应该可以找到
    var selectorLast = parts.pop();
    //根据最后一个元素查找,如果是id查找，那么得到一个元素，其他得到类数组对象
    var queryResult = direct(selectorLast, queryActions);
    //console.log(queryResult);
    //下面这句话，如果是类数组对象，那么转换为一个数组，否则得到的是空数组
    if (queryResult) {
        queryArr = [].slice.call(queryResult);
    }
    //如果根据id查找的，或者查找结果为空，那么直接返回；否则递归过滤父节点（这里默认了不会出现a #test类似的组合）

    return queryArr[0] && parts[0] ? filterParents(parts, queryArr) : queryResult;
}

$.event = {
    //定义这个数组的作用在于，除了删除指定type上绑定的特定listener事件之外，还可以删除指定type上绑定的所有事件
    listeners: []
};

//为元素element绑定event事件的处理函数listener
//1.DOM0级（IE8之前)，采用onClick=listener的方式,这种方法的缺点是不能为一个事件绑定多个处理函数
//2.DOM2级别：addEventListener,其作用域是所属元素的作用域
//3.IE:attachEvent，其作用域是全局作用域
$.event.addEvent = function(element, type, listener) {
    type = type.replace(/^on/i, ‘‘).toLowerCase();
    //将作用域this都限制到元素的作用域
    var lis = $.event.listeners;
    var realListener = function(e) {
        listener.call(element, e);
    }
    if (element.addEventListener) {
        element.addEventListener(type, realListener, false);
    } else if (element.attachEvent) {
        element.attachEvent(‘on‘ + type, realListener);
    } else {
        element[‘on‘ + type] = realListener;
    }
    $.event.listeners.push([element, type, listener, realListener]);
    //返回元素，便于链式操作
    return element;
};

$.event.removeEvent = function(element, type, listener) {
    type = type.replace(/^on/i, ‘‘).toLowerCase();
    //var isRemoveAll=listener?false:true;
    var isRemoveAll = !listener;
    var lis = $.event.listeners;
    for (var i = 0, len = $.event.listeners.length; i < len; i++) {
        var curLis = lis[i];
        if (curLis[0] === element && curLis[1] === type && (isRemoveAll || curLis[2] === listener)) {
            if (element.removeEventListener) {
                element.removeEventListener(type, curLis[3], false);
            } else if (element.detachEvent) {
                element.detachEvent(‘on‘ + type, curLis[3]);
            } else {
                element[‘on‘ + type] = null;
            }
            lis.splice(i,1);
        }
    }
    return element;
};


//完成click事件的绑定
$.event.addClicEvent=function(element,listener){
    $.event.addEvent(element,‘click‘,listener);
};

//实现当用户按下enter按键时候的绑定
$.event.addEnterEvent=function(element,listener){
    $.event.addEvent(element,‘keypress‘,function(e){
        //IE中event位于全局对象中
        var event=e||window.event;
        var keyCode=event.charCode||event.keyCode;
        if(keyCode===13){
            listener.call(element,event);
        }


    });
};

//实现事件代理功能
//根据冒泡原理，为父元素绑定监听事件
$.event.delegateEvent=function(element,tag,type,listener){
    $.event.addEvent(element,type,function(e){
        var event=e||window.event;
        var target=event.target||event.srcElement;
        if(target&&target.tagName.toLowerCase()===tag.toLowerCase()){
            listener.call(target,event);
        }
    });
};

//进行进一步的封装
$.on=function(selectorText,type,listener){
    $.event.addEvent($(selectorText),type,listener);
};

$.un=function(selectorText,type,listener){
    $.event.removeEvent($(selectorText),type,listener);
};
$.click=function(selectorText,listener){
    $.event.addClicEvent($(selectorText),listener);
};
$.delegate=function(selectorText,tag,type,listener){
    $.event.delegateEvent($(selectorText),tag,type,listener);
};