getElementsByClassName函数实现获取指定类名的子元素列表,语法如下:
var elements = getElementsByClassName(element, names);
使用示例如下:
如果html元素
<div id="example">
    <p id="p1" class="aaa bbb"/>
    <p id="p2" class="aaa ccc"/>
    <p id="p3" class="bbb ccc"/>
</div>

1.getElementsByClassName('aaa bbb')返回的是id为p1的元素

2.getElementsByClassName('ccc bbb')返回的是id为p3的元素

3.getElementsByClassName('aaa')返回的是id为p1和p2的元素集合

 

需求分析:

  当形参names传入的是一个实参的时候,返回所有class名为此参数的集合;

  当形参names传入多个实参,返回class名同时具备这些实参的元素;

  所以直接用indexOf查找并不能实现需求,解题如下:

function getElementsByClassName(element,names){
            var elements = element.getElementsByTagName('*'); //element下的元素集合
            var name,
                ele,
                flag,
                outPut=[];

            var splitNames = names.split(" ");       //对传入的参数进行拆分,转为数组
                for(var i=0;i<elements.length;i++){
                    ele = elements[i].className;   //存储当前循环到的元素
                    flag = true;                             //状态管理,设定为true

                    for(var a=0;a<splitNames.length;a++){
                        name = splitNames[a];       //当前循环到的names,挨个进行检查
                        if(ele.indexOf(name) == -1){
                            flag = false;                //如果names函数中传入的参数有一个在当前ele的className中找不到,flag即为false并退出循环
                            break;
                        }    
                    }
                    if(flag){
                        outPut.push(elements[i]);  //一次循环后加入flag状态仍然为true,再往返回的数组中添加此元素
                    }
                }
                return outPut;

        }