通過js操作樣式(評分)
阿新 • • 發佈:2017-06-19
所有 fun ++ () 事件 attribute nbsp 設置 spa
<style> td{ font-size:50px; color:yellow; cursor:pointer; } </style> <script type="text/javascript"> window.onload = function () { //獲取所有td var tds = document.getElementById(‘tabRate‘).getElementsByTagName(‘td‘);//為每個td註冊一個onmouseover和onmouseout事件 for (var i = 0; i < tds.length; i++) { //鼠標懸浮事件 tds[i].onmouseover = function () { //設置從第0個開始到當前鼠標移動到td位置為實心五角星 for (var c = 0; c < tds.length; c++) { tds[c].innerHTML= ‘★‘; if (tds[c] == this) { break; } } }; //鼠標離開事件 tds[i].onmouseout = function () { for (var c = 0; c < tds.length; c++) { tds[c].innerHTML= ‘☆‘; if (tds[c] == this) { break }; } }; //為每個td註冊單擊事件 tds[i].onclick = function () { for (var c = 0; c < tds.length; c++) { tds[c].removeAttribute(‘isclicked‘); } this.setAttribute(‘isclicked‘, ‘isclicked‘); }; } } </script> </head> <body> <table id="tabRate" border="0" cellpadding="0" cellspacing="0"> <tr> <td>☆</td> <td>☆</td> <td>☆</td> <td>☆</td> <td>☆</td> </tr> </table> </body>
通過js操作樣式(評分)