Javascript 更改选定选项的背景色

我有一个选择对象，我正在尝试更改所选选项的背景色。 因此，当我选择“绿色”选项时，背景颜色必须更改为从属性数据颜色中获取的绿色信息

以下方法可行，但不考虑属性数据颜色，只使用一种红色。我可以使用jQuery解决方案或纯CSS

$selectcolors.changefunction{ var$thisMenu=$this； $thisMenu.childrenoption.cssbackground； var$thispoption=$thismmenu.childrenoption:选中； var color=$thispoption.datacolor； $thisOption.css背景，线性梯度0度，+颜色+0%，+颜色+100%； }; 红色 绿色 黄的

---

非常感谢。但是，一旦选择了某个选项，就必须更改颜色。你的例子不是这样的。当选择另一个选项时，背景色必须设置为无。当您参考背景色时，您是指该选项的背景色还是整个菜单的背景色？选项的颜色看起来更好，但当选择另一个选项时，背景色必须设置为无。只是选择的选项必须改变颜色。是的，很遗憾我忘记了。我做了另一个改变。很抱歉，你读了这个吗？

<select id="colors" size="5" style="height:80px;width:100px">
 <option value="1" data-color="red">red</option>
 <option value="2" data-color="green">green</option>
 <option value="3" data-color="yellow" >yellow</option>
</select>

select:focus option:checked {
  background: red linear-gradient(0deg, red 0%, red 100%);
}