js实现简单星级评论

话不多说上代码

       <ul>
			<li class="fl">♥</li>
			<li class="fl">♥</li>
			<li class="fl">♥</li>
			<li class="fl">♥</li>
			<li class="fl">♥</li>
		</ul>

css代码

<style type="text/css">
			ul {
				font-size: 80px;
			}
			.fl{
				float: left;
			}

			.cors {
				color: pink;
			}
		</style>

js

<script type="text/javascript">
		选中类名为fl的li
			var _lis = document.querySelectorAll(".fl");
			//item：每一项
			// index：下标
			_lis.forEach(function(item, index) {
				item.onclick = function() {
					if (!item.classList.contains("cors")) {
						for (a = 0; a <= index; a++) {
							_lis[a].classList.add("cors")
						}
					} else {
						for (r = index+1 ; r <= 4; r++) {
							_lis[r].classList.remove("cors");
						}
					}
				}
			})
		</script>