标签归档:前端

复习Javascript的一些代码(未完待续)

偶尔翻出来以前写的一些小东西。做应用开发久了,久而久之一开始就很注意框架的选择。但是最初写Javascript那种alert逐步调试。写一些通用的工具类的时间仿佛离我很远了。翻了下以前的一些代码,把他贴出来。就权当是复习下吧。

/**
 * author:      可乐加糖
 * description: 呵呵,不知道写什么好,随便吧。
 */

(function (window) {
    //基础类库
    var cola = {
        get_node: function (elem_id) {
            if (elem_id.constructor != String) {
                throw new Error("参数传递错误");
                return false;
            }
            return document.getElementById(elem_id) || null;
        },
        prev: function (elem) {
            do {
                elem = elem.previousElementSibling
            } while (elem && elem.nodeType != 1);
            return elem
        },
        next: function (elem) {
            do {
                elem = elem.nextSibling;
            } while (elem && elem.nodeType != 1);
            return elem
        },
        first_node: function (elem) {
            elem = elem.firstChild;
            return elem && elem.nodeType != 1 ? this.next(elem) : elem;
        },
        last: function (elem) {
            elem = elem.lastChild;
            return elem && elem.nodeType != 1 ? prev(elem) : elem;
        },
        parent: function (elem, num) {
            num = num || 1;
            for (var i = 0; i < num; i++) {
                if (elem != null)
                    elem = elem.parentNode;
                return elem;
            }
        },
        remove: function (elem) {
          if(elem)
            elem.parentNode.removeChild(elem);
        },
        empty: function (elem) {
            while(elem.firstChild)
                elem.removeChild(elem.firstChild)
        }
    }
    window.cola = cola;
})(window)

这是最开始写的一个二级下拉导航条的代码

document.getElementsByClassName = function(clsName){
    if(typeof(clsName)!="string" || clsName.constructor != String){
        throw new Error("className必须是字符串");
        return false;
    }
    var nodes = document.getElementsByTagName("*");
    var nodeArr = new Array();
    for(var i= 0,icount = nodes.length;i<icount;i++){
        if(nodes[i].className == clsName)
            nodeArr.push(nodes[i]);
    }
    return nodeArr;
}
window.onload = function(){
    var nodes = document.getElementsByClassName("has-child");
    for(var i= 0,icount = nodes.length;i<icount;i++){
        nodes[i].onmouseover = function(){
            var child_menu = this.getElementsByTagName("ul");
            child_menu[0].style.display = "block";
        }
        nodes[i].onmouseout = function () {
            var child_menu = this.getElementsByTagName("ul");
            child_menu[0].style.display = "none";
        }
    }
}

还有获取元素的样式表,当初也是在IE下调试了很久才搞定。

function getStyle(elem,name){
    if(elem.style[name])
        return elem.style[name];
    else if(elem.currentStyle)
        return elem.currentStyle[name];
    else if(document.defaultView && document.defaultView.getComputedStyle){
        name = name.replace(/([A-Z])/g,"-$1");
        name = name.toLowerCase();
        var s = document.defaultView.getComputedStyle(elem,"");
        return s && s.getPropertyValue(name);
    }
    else
        return null;
}