如何将按钮图标从夜间模式切换到白天模式

Question

在下面的代码中，我将一些js/jQuery链接到了html中的元素，这应该是不言自明的。我让控制台记录了每个if-else语句，看看问题出在哪里，它似乎卡在了第一个if语句上。

function toggleDisplay() {
var icon = document.getElementById("togglebutton");
var night_icon = 'assets/Feed_Toggle_Night.png'
var day_icon = 'assets/Feed_Toggle_Day.png'
$("displaytog").on("click", () => {
if (icon.src == night_icon) {
icon.src = day_icon;
console.log("success1");
}else {
icon.src = night_icon;
console.log("success2");
}
})
}
toggleDisplay();

<displaytog>
<img src="assets/Feed_Toggle_Night.png" id="togglebutton"/>
</displaytog>

Answer 1

您意外地将icon.src分配给night_icon。更改您的条件以检查它们是否包括您的任何路径。您需要使用includes的原因是src是完整路径，而您的条件是使用相对路径。src看起来像这样-"https://fiddle.jshell.net/_display/assets/Feed_Toggle_Day.png"

if (icon.src.includes(night_icon))