当用户第一次将鼠标悬停在标签上时，如何从字段集标签中删除 css 样式？

Question

我的 fieldset 星级选择器有以下 fiddle：

https://jsfiddle.net/bxd107gv/

它被设计为默认为 5 颗星，但用户可以在适当时单击一颗星将选择修改为较小的值；但是；我觉得风格：

.rating > label{
    color:#FFD700;
}

通过应用它进行干扰，所以我尝试在 JS 中执行鼠标悬停事件以将星星设置回其默认颜色，但这有完全相同的问题，但颜色不同；我该如何修改，以便在用户从 5 星更改为任何其他值后，只有选中的星标以黄色突出显示，其余星标为灰色？

Answer 1

评分时可以在容器上加一个class来标示已评分的状态，在已评分的容器中的标签上额外加一个已评分的css：

1. 将以下 javascript 添加到您处理评分逻辑的函数 setRating

document.getElementById('starRatingSelection').classList.add('rated');

2. 在 css 文件的末尾添加以下 css

.rated > label{
  color: #a5a5a5;
}