如何将CSS应用于此Javascript代码？

我正在开发一款需要根据用户设备显示图像的应用程序。因此，我使用以下Javascript代码来显示菜单及其图标：

  var $imgsrc;

  if(dummy_url_decode(results.rows.item(i).title) == "Web Info")

     $imgsrc = "icons/web_info.png";

  if(dummy_url_decode(results.rows.item(i).title) == "Misc.")

     $imgsrc = "icons/misc.png";

现在我想应用条件，如果设备带有视网膜显示器，那么它应该为它显示不同的图标。我有媒体查询语法，但不知道如何从CSS更改img路径。有人能帮我吗？我使用的媒体查询是：

@media screen and (-webkit-min-device-pixel-ratio: 2) and (min-device-width : 768px) and (max-device-width : 1024px)

---

您不能从CSS更改属性

您最好的选择可能是使用

或

而不是图像，将其样式设置为

显示：内联块

，具有合适的

宽度和
高度
，然后您可以在媒体查询中更改
背景图像
属性

大概是这样的：

HTML:

<span id="myIcon"></span>

谢谢你的回复，但是你能用示例代码解释一下吗？我不熟悉CSS和javascript，所以它对我很有帮助！
#myIcon {
    display:inline-block;
    width:32px;
    height:32px;
    background-image:url('icons/some_icon.png');
}
@media screen and (-webkit-min-device-pixel-ratio:2) and (min-device-width:768px) and (max-device-width:1024px) {
    #myIcon {
        width:64px;
        height:64px;
        background-image:url('icons/some_hi-res_icon.png');
    }
}