js五角星评分特效

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var isclick = false;
        function initEvent() {
            var tableWjx = document.getElementById("tableWjx");
            var tds = tableWjx.getElementsByTagName("td");
            for (var i = 0; i < tds.length; i++) {
                var td = tds[i];
                td.onmouseover = change;
                td.onmouseout = repeal;
                td.onclick = change1;
            }
        }
        function change() {
            if (!isclick) {
                var tableWjx = document.getElementById("tableWjx");
                var tds = tableWjx.getElementsByTagName("td");
                var index = indexof(tds, this);
                for (var i = 0; i < index + 1; i++) {
                    var td = tds[i];
                    td.innerText = "★";
                }
            }
        }
        function repeal() {
            if (!isclick) {
                var tableWjx = document.getElementById("tableWjx");
                var tds = tableWjx.getElementsByTagName("td");
                var index = indexof(tds, this);
                for (var i = 0; i < index + 1; i++) {
                    var td = tds[i];
                    td.innerText = "☆";
                }
            }
        }
        function indexof(arr, ele) {
            for (var i = 0; i < arr.length; i++) {
                if (arr[i] == ele) {
                    return i;
                }
            }
            return -1;
        }
        function change1() {
            if (!isclick) {
                change();
                isclick = true;
            }
            else {
                alert("Sorry,You had clicked me!");
            }
        }
    </script>
</head>
<body onload="initEvent()">
<table id="tableWjx"><tr><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td></tr></table>
</body>
</html>

如果觉得我做的五角星不好看，完全可以把五角星的位置换成图片路径