2015-9-13(js获取class)

原生js获取页面中的className,涉及到document.getElementsByClassName

1.单个className的获取

function getByClassName(oParent,sClass){
    var elements = oParent.getElementsByTagName("*");　　//查找从目标父级下的所有标签
    var result = [];
    for(var i = 0;i<elements.length; i++){　　　　　　　　 //循环父级下的所有标签
        if(elements[i].className == sClass){　　　　　　　//如果某标签的className == 目标className

            result.push(elements[i])　　　　　　　　　　　　//则添加到数组里
        }
    }
    return result;　　　　　　　　　　　　　　　　　　　　　　//返回数组
}

2.多个class获取—>正则表达式

function getByClassName(oParent,sClass){
    var elements = oParent.getElementsByTagName("*");
    var result = [];
    var reg = new RegExp("\\b" + sClass + "\\b","g");
    for(var i = 0;i<elements.length;i++){
        //字符串search方法判断是否存在匹配
        if(elements[i].className.search(reg) != -1){
            result.push(elements[i])
        }
    }
    return result;
}

3.多个class获取->数组

function getByClassName(oParent,sClass){
    var elements = oParent.getElementsByTagName("*");
    var result = [];
    for(var i = 0;i < elements.length;i++){
        var arr = elements[i].className.split(/\s+/);
        for(var j = 0;j<arr.length;j++){
            if(arr[j]== sClass){
                result.push(elements[i]);
            }
        }
    }
    return result;
}