首页 > 代码库 > 星级评价

星级评价

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>星级评价</title>    <style type="text/css">        .star{padding: 0; margin:0;}        .star em{ width: 27px; height: 27px; background: url(star.gif) no-repeat top left;float:left;}        .star em.color{ background: url(star.gif) no-repeat bottom left; }        .star span{padding-left: 5px; line-height: 30px;}    </style></head><body><div id="star" class="star">    <em mytitle="很差"></em>    <em mytitle="差"></em>    <em mytitle="中"></em>    <em mytitle="好"></em>    <em mytitle="很好"></em>    <span></span></div></body></html><script>var oDiv=document.getElementById("star");var aEm=oDiv.getElementsByTagName("em");var result=oDiv.getElementsByTagName("span")[0];for (var i = 0; i < aEm.length; i++) {    aEm[i].index=i;    aEm[i].onmouseover=function(){    for (var i = 0; i < aEm.length; i++) {        if(i<=this.index){            aEm[i].className="color"        }else{            aEm[i].className=""        }    }        result.innerHTML=this.getAttribute("mytitle");    }};</script>

 

星级评价