原生javascript网站评论打分源代码分享

今天是2013年开始的第二个工作星期，这周我的前端开发任务比较多，学习了原生javascript之后，开始把公司网站所应用到的交互特效 都想要用javascript来实现。下面这个是关于网站评论打分的js简单交互特效。网站截图如下：javascript原生代码如下：因为该程序只要知道是那个id 就可以了。

<script type="text/javascript">
var oDiv=document.getElementById('dafen').getElementsByTagName('p');
var now;
for(var i=0; i<oDiv.length;i++){
var oTxt=oDiv[i].getElementsByTagName('input')[1];
var oSpan=oDiv[i].getElementsByTagName('i')[0];
oTxt.value='6分';
oSpan.style.width=parseInt(oTxt.value.replace(/[^0-9]/ig,""))*10+'%';
oDiv[i].index=i;
oDiv[i].onmouseover=function(){
now=this.index;
var oBtn1=oDiv[now].getElementsByTagName('input')[0];
var oBtn2=oDiv[now].getElementsByTagName('input')[2];
var oTxt1=oDiv[now].getElementsByTagName('input')[1];
var oSpan1=oDiv[now].getElementsByTagName('i')[0];
var num=parseInt(oTxt1.value.replace(/[^0-9]/ig,""));
oBtn1.onclick=function(){
if(num>1){
num=num-1;
oTxt1.value=num+'分';
oSpan1.style.width=num*10+'%';
}
}
oBtn2.onclick=function(){
if(num<10){
num=num+1;
oTxt1.value=num+'分';
oSpan1.style.width=num*10+'%';
}
}
}
}
</script>