评分系统

一个评分的代码，很简单！
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>New Web Project</title>
        <style>
            #pingfen ul {
                 150px;
                margin: 10px auto;
                overflow: hidden;
            }
            
            #pingfen li {
                 20px;
                float: left;
                height: 20px;
                cursor: pointer;
                background: blue;
                border: 5px solid #fff;
                list-style: none;
            }
            
            #pingfen .active {
                background: red;
            }
            
            #num {
                text-align: center;
                font-size: 14px;
                color: blue;
            }
        </style>
        <script type="text/javascript">
            window.onload = function(){
                try {
                    var oLi = document.getElementsByTagName('li');
                    var oNum = document.getElementById('num');
                    var num = 0;
                    var i = 0;
                    for (i = 0; i < oLi.length; i++) {
                        oLi[i].index = i;
                        oLi[i].onmouseover = function(){
                            for (i = 0; i < oLi.length; i++) {
                                oLi[i].className = '';
                            }
                            for (i = 0; i <= this.index; i++) {
                                oLi[i].className = 'active';
                            }
                        }
                        oLi[i].onmouseout = function(){
                            for (i = 0; i < oLi.length; i++) {
                                oLi[i].className = '';
                            }
                            for (i = 0; i <= num; i++) {
                                oLi[i].className = 'active';
                            }
                        }
                        oLi[i].onclick = function(){
                            num = this.index;
                            oNum.innerHTML = num + 1;
                            for (i = 0; i <= this.index; i++) {
                                oLi[i].className = 'active';
                            }
                        }
                    }
                } 
                catch (e) {
                    alert('页面异常');
                };
                }
        </script>
    </head>
    <body>
        <div id="pingfen">
            <ul>
                <li>
                </li>
                <li>
                </li>
                <li>
                </li>
                <li>
                </li>
                <li>
                </li>
            </ul>
        </div>
        <p id="num">
            0
        </p>
    </body>
</html>