如果有几个盒子都要设置信息滚动，可以设置相同的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循环便利一下就行了