如果有几个盒子都要设置信息滚动，可以设置相同的class名，js怎么获取？

Question

这里设置的是id,可以实现，但如果是几个盒子中的信息都想要实现滚动，这是由于id唯一，只能设置class，那么如果把js设为 var area = document.getElementsByClassName(“text”');但实现不了，请问如何解决？<div class="info"> <div class="info-left"> <div class="up"> <div class="title">软件</div> <div class="text"> <ul> <li><a href="#">1.学会html5 绝对的屌丝逆袭（案例）</a></li> <li><a href="#">2.tab页面切换效果（案例）</a></li> <li><a href="#">3.圆角水晶按钮制作（案例）</a></li> <li><a href="#">4.HTML+CSS基础课程(系列)</a></li> <li><a href="#">5.分页页码制作（案例）</a></li> <li><a href="#">6.导航条菜单的制作（案例）</a></li> <li><a href="#">7.信息列表制作(案例)</a></li> <li><a href="#">8.下拉菜单制作(案例)</a></li> <li><a href="#">9.如何实现“新手引导”效果</a></li> </ul> </div> </div> <div class="down"> <div class="title">面试</div> <div class="text"></div> </div> </div> <div class="info-right"> <div class="up"> <div class="title">软件</div> <div class="text"> <ul> <li><a href="#">1.学会html5 绝对的屌丝逆袭（案例）</a></li> <li><a href="#">2.tab页面切换效果（案例）</a></li> <li><a href="#">3.圆角水晶按钮制作（案例）</a></li> <li><a href="#">4.HTML+CSS基础课程(系列)</a></li> <li><a href="#">5.分页页码制作（案例）</a></li> <li><a href="#">6.导航条菜单的制作（案例）</a></li> <li><a href="#">7.信息列表制作(案例)</a></li> <li><a href="#">8.下拉菜单制作(案例)</a></li> <li><a href="#">9.如何实现“新手引导”效果</a></li> </ul> </div> </div> <div class="down"> <div class="title">面试</div> <div class="text"></div> </div> </div> </div>js: <script type="text/javascript"> var area = document.getElementByClassName('text'); var iliHeight = 24;//单行滚动的高度 var speed = 50;//滚动的速度 var time; var delay= 2000; area.scrollTop=0; area.innerHTML+=area.innerHTML;//克隆一份一样的内容 function startScroll(){ time=setInterval("scrollUp()",speed); area.scrollTop++; } function scrollUp(){ if(area.scrollTop % iliHeight==0){ clearInterval(time); setTimeout(startScroll,delay); }else{ area.scrollTop++; if(area.scrollTop >= area.scrollHeight/2){ area.scrollTop =0; } } } setTimeout(startScroll,delay) </script>

Answer 1

通过类名获取元素返回的是一个数组，写个for循环便利一下就行了