Javascript 单击菜单栏时JScript隐藏徽标

我想隐藏上一个徽标和菜单栏，但当我单击菜单栏时。但结果却出乎意料

HTML:

---

您可以使用image.style.diplay='none'进行隐藏，使用image.style.diplay='inline block'进行显示，而不是更改src

HTML

---

img上未设置“Id”属性。您可以使用image.style.diplay='none'进行隐藏，使用image.style.diplay='inline block'进行显示，而不是更改src。更新了答案，现在可以检查了吗。

<div class="header">
     <img src="common/img/logo.png" class="logo">
     <input type="checkbox" id="chk">
     <label for="chk" class="show-menu-btn" onclick="myChk()">
         <i class="fas fa-bars"></i>
     </label>
     <label for="chk" class="hide-menu-btn">
         <i class="fas fa-times"></i>
     </label>

function myChk(){

    var image = document.getElementById("show-menu-btn");

    if(image.src.match("show-menu-btn")){
        image.src = "none";
    }else{
        image.src = "common/img/logo.png";
    }
}

<div class="header">
     <img src="common/img/logo.png" class="logo" id="logo">
     <input type="checkbox" id="chk">
     <label for="chk" class="show-menu-btn" onclick="myChk()">
         <i class="fas fa-bars"></i>
     </label>
     <label for="chk" class="hide-menu-btn">
         <i class="fas fa-times"></i>
     </label>
</div>

function myChk(){

    var image = document.getElementById("logo");

    if(image.style.display === 'none'){
        image.style.display = "inline-block";
    }else{
        image.style.display = "none";
    }
}