我正在参加「码上掘金挑战赛」详情请看：码上掘金挑战赛来了！”
详细说明
看到element里面有一个很不错的星星评分组件，很实用；突然感觉自己也可以来实现一个超简单的星星评分。 当然不需要像element那么多的功能，不需要那么的复杂，只需要出现星星点亮的那个样式就可以了。
页面也不需要太多的元素，只需要画上小星星就可以了，一般评分都是五分、十分这样子的，这里就大方点，给十个星星吧。
首先html代码里加个ul标签就可以，用来作为星星的容器。
<ul id="stars"></ul>
星星就写在li标签里面，页面上html代码中也没有li标签，这里我们可以使用js创建进去，毕竟10个说多不多，说少不少，js创建元素就刚刚好。
需要10个li标签，就循环创建10次，创建之后，这里也不需要额外添加样式代码，只需要将“☆”符号添加到li标签里，当做文本。然后再将创建的li标签append到ul标签里面。
代码实现：
addElement();
function addElement() {
for( let i=0; i<=10; i++) {
let el = document.createElement('li');
el.innerHTML = '☆';
$("#stars").append(el);
}
}
到了这一步，10个星星就可以显示出来了，还差重点的一步：当鼠标划到某个星星时，它自己以及前面的星星都需要高亮。在jquery里面有这样的方法，prevAll():找到本身前面的所有兄弟元素（包括自己本身），nextAll()找本身后面的所有元素（包括自己本身），这样当划到某一个星星时，就可以将其本身和前面所有的兄弟元素都高亮（改变颜色，替换实体字符），而后面的所有兄弟元素都去除高亮。
代码实现：
$("li").on("mouseover", function() {
$(this).css("color", "yellow").html("★");
$(this).prevAll().css("color", "yellow").html('★');
$(this).nextAll().css("color", "#ccc").html("☆");
})
