在鼠标悬停/取消切换父元素上，更改子映像的url散列

Question

我的<li>里面有<img>。 我想通过他的班级或身份证来挑选每一个。 此<img>是带有 #black 和 #white 版本的SVG，我的HTML中的网址以 #black 作为默认值结尾。 我需要的： 当我悬停<li>时，我需要 的网址末尾从 #black 更改为 #white ，当用户取消切换时，再次更改为 #black 。 如何在Javascript中操作文本的结尾（在此示例中为<img url="">处的＃）？

提前致谢，我相信本主题的答案也可以帮助其他用户。

Answer 1

编辑2：

（如果您愿意，可以将“img”替换为您的选择器）

$("li.navi-item").hover(function() {
  $(this).find("img").attr("src", $(this).find("img").attr("src").replace("#black", "#white"));
}, function() {
  $(this).find("img").attr("src", $(this).find("img").attr("src").replace("#white", "#black"));
});

将代码放入$（文档）.ready（function（）{}