简单的跑马灯效果代码实现

<html>
<head>
<style>
 .red {
   color:red; 
}
 .green {
   color:green; 
}
</style>
<script type="text/javascript">
var current = 0;
var dir=0;
<p>function setColor() {
var sp = document.getElementsByTagName(&quot;span&quot;);
for(i=0; i&lt;10; i++) {
if(i==current)
sp[i].className=&quot;red&quot;;
else
sp[i].className=&quot;green&quot;;
}
}</p>
<p>function Move()
{
if(dir==0) {
if(current==9)
dir=1;
else
current++;
} else {
if(current==0)
dir=0;
else
current--;
}</p>
<p>setColor();
}</p>
<p>function ready()
{
setColor();
window.setInterval('Move()', 500);
}
</script></p>
</head>
<body onload="ready()">
<center>
<span>●</span>
<span>●</span>
<span>●</span>
<span>●</span>
<span>●</span>
<span>●</span>
<span>●</span>
<span>●</span>
<span>●</span>
<span>●</span>
</center>
</body>
</html>
<p>以上是已补全的网页代码，实现了一个简单的跑马灯效果。页面加载完成后，使用 JavaScript 控制红色圆点的移动。每隔 0.5 秒，红色圆点会在绿色圆点中左右移动，形成跑马灯的效果。通过 CSS 样式定义红色圆点和绿色圆点的颜色。</p>