                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /瀑布流布局

能帮我看下哪里出问题了么？检查了N多遍，还是没检查出问题所在

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
   <title>Document</title>
    <script type="text/javascript">
window.onload=function(){
    var oParent = document.getElementById("list");
    var len1 = getByClass("on","list");
    alert(len1.length);
    var len2 = getByClass("on");
    alert(len1.length);

}
function getByClass(clsName, parent){
//定义函数getByClass()实现获取document或指定父元素下所有class为on的元素
   var oClass = parent.getElementsByTagName("*");
   var boxArr = new Array();
   for(var i =0;i<oClass.length;i++){
       if(oClass[i].className == clsName){
           boxArr.push(oClass[i]);
       }
       return boxArr;
   }
}
</script>
</head>
<body>
       <ul id="list">
           <li>1</li>
           <li>2</li>
           <li>3</li>
           <li>4</li>
       </ul>
       <p>class为on的p标签</p>
</body>
</html>

Missvia

2016-01-25

源自：瀑布流布局 2-6

关注问题我要回答

1146

操作

收起

7 回答

qq_风起叶落_0
2016-09-15

我能发现的问题都在图里，本地测试ok了，你可以改改试试

0 回复有任何疑惑可以回复我~

收起回答

慕粉3413685
2016-06-12

1、getByClass(clsName,parent)函数里的parent参数是元素的ID，而不是元素本身，所以应该通过document.getElementById(parent)，先定位到这个元素，然后再getElementsByTagName(clsName)获取元素下所有的子元素。

2、就是首先要判断参数parent是否存在，如果存在，就用document.getElementById(parent)定位元素，如果不存在，就document.body定位全局。用三目运算判断比较快捷一些，写法如下var oClass=（parent？document.getElementById(parent)：document.body）.getElementsByTagName(clsName)

3、你的 return boxArr;写在了for循环里面，导致循环只执行一次就跳出函数了，也就是只判断了第一个子元素的class是不是on。所以应该return boxArr;写在getByClass(clsName,parent)函数的最后一句，因为执行了return语句，函数就跳出了，return后面的任何语句都不会再执行。

4、你的body里也没给任何元素添加名称为on的class类。

0 回复有任何疑惑可以回复我~

收起回答

慕粉3413685

前两条有点错误，应该是是通过getElementsByTagName("*")获取所有子元素，更正一下： var oClass=（parent？document.getElementById(parent)：document.body）.getElementsByTagName("*")

2016-06-12 回复有任何疑惑可以回复我~

请叫我橙子蛋
2016-03-28

<!doctype html>

<html>

<head>

<title>Document</title>

window.onload=function(){

var len1 = getByClass("on","list");

alert(len1.length);

var len2 = getByClass("on");

alert(len2.length);

}

function getByClass(clsName,parent){

//定义函数getByClass()实现获取document或指定父元素下所有class为on的元素

var oParent=parent?document.getElementById(parent):document,

oClass = oParent.getElementsByTagName('*');

var boxArr = new Array();

for(var i=0;i<oClass.length;i++){

if(oClass[i].className==clsName){

boxArr.push(oClass[i]);

}

return boxArr;

}

</script>

</head>

<body>

</ul>

<p class="on">class为on的p标签</p>

</body>

</html>

大兄弟你这个问题比较多啊，上面是我根据你的改的，你对比着学习一下吧

0 回复有任何疑惑可以回复我~

收起回答

菜菜的小鸟
2016-03-08

var len1 = getByClass("on","list");
    alert(len1.length);
    var len2 = getByClass("on");
    alert(len1.length);

将len1改为len2！再将参数里的引号改为英文引号即可！

0 回复有任何疑惑可以回复我~

收起回答

weibo_懒人壮壮_0
2016-02-25

return boxArr; 往外挪一层，遍历完了再返回

0 回复有任何疑惑可以回复我~

收起回答

lejsure
2016-02-19

var len1 = getByClass("on","list");

这句应该是

var len1 = getByClass("on",oParent);

0 回复有任何疑惑可以回复我~

收起回答

jiaojiaoAIhaha
2016-01-26

    var len1 = getByClass("on","list");
    alert(len1.length);
    var len2 = getByClass("on");

//弹出len2的长度
alert(len2.length);

}
function getByClass(clsName, parent){
//定义函数getByClass()实现获取document或指定父元素下所有class为on的元素

//先判断parent是否存在

if(parent){

var oClass = ducument.getElementById(parent).getElementsByTagName("*");

}else{
var oClass = document.getElementsByTagName("*");

}
   var boxArr = new Array();
   for(var i =0;i<oClass.length;i++){
       if(oClass[i].className == clsName){
           boxArr.push(oClass[i]);
       }
       return boxArr;
   }
}
</script>