jquery+iconfont實現星星評分功能

此處使用了confront的圖標，用.js_star類名來觸發click（）事件。.inconfont-coor爲confront圖標賦予了顏色（黃色），每次點擊星星時第一次js循環會把所有星星的顏色都去掉，然後第二次循環會再次將顏色賦值給點到的那個星星以及它前面所有的星星。

/*HTML代碼*/
<div class="js_star">
    <i class="iconfont icon-xingxing_selected i"></i>
    <i class="iconfont icon-xingxing_selected i"></i>
    <i class="iconfont icon-xingxing_selected i"></i>
    <i class="iconfont icon-xingxing_selected i"></i>
    <i class="iconfont icon-xingxing_selected i"></i>
</div>

<script>

    $(".js_star i").click(function() {
        var num = $(this).index();
        var elements = document.getElementsByClassName('iconfont icon-xingxing_selected i');
        // console.log(elements);
        for (var i = 0; i < 5; i++) {
            var dom = elements[i];
            $(dom).removeClass("iconfont-color1");
        }
        for (var i = 0; i < elements.length; i++) {
            if (i <= num) {
                var dom = elements[i];
                $(dom).addClass("iconfont-color1");
            }
        }

    })


</script>