详解JS的getByclass方法

JS给我们提供了document.getElementById(),document.getElementsByTagName()等获取元素的方法。但是没有通过类名获取元素的方法，所以我们要自己写一个方法。

//通过class的选择器

function getByClass(parent,cla) {

    var ele=parent.getElementsByTagName("*");

    var result=[];

    var re=new RegExp("\\b"+cla+"\\b","g");

    for(i=0;i<ele.length;i++)

    {

        if(ele[i].className.search(re)!==-1)

        {

            result.push(ele[i]);

        }

    }

    return result;

}

这里解释一下上在的代码：
getByClass(parent,cla)：

这里有两个参数：

parent 你要获取的元素所在的父级，cla：你要获取的元素的类名（className）。

var ele=parent.getElementsByTagName("*");

这是获取parent下的所有的元素。

var result=[];

用一个数组来存放 符合我们要找的类名的元素，之所以用数组，是因为类名是可以重复使用。有多个情况存在的情况。所以要用数组来存。

var re=new RegExp("\\b"+cla+"\\b","g");

正则表达式RegExp的一些解释：g:全局匹配（不会找到第一个匹配就结束）；i:对大小写匹；m:执行多行匹配

\b 是语法 匹配一个单词边界，也就是指单词和空格间的位置

\\b 是转译 匹配 “\b"。
这东西我也不是很懂，通俗一点解释这里的功能就是：因为存在<div class="class1 class2"></div> 一个DIV同时有多个类名。所以我们需要将类名分别拆分出来一个一个匹配。

然后for循环ele里的元素。开始能匹配我们需要的类名
if(ele[i].className.search(re)!==-1)

这里的re就是上面用到的正则表达式。

search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。如果没有找到任何匹配的子串，则返回 -1。

在第i个ele中寻找我们要的类名！结果返回-1 是说明没有找到  加个逻辑运算符非!  说明找到了！

找到了就将元素存入数组
result.push(ele[i]);   

最后返回数组。

调用方法：
var bb=getByClass(aa,'bb')[0];  注意后面有个[0]    因为getByClass返回的是一个数组！！所以我们要根据位置获取，只有一个元素的数组 ，那些位置就是在0！