我想使用 javascript 在我的网页中隐藏搜索栏

Question

I am making a strip menu which turns to hamburger when the page shrinks, am doing it with js, but the search bar is next to it and gets ugly when it toggles, question is how to hide the search bar when the ham-menu is clicked.. I think i can add some lines inside the function to hide it, i have tryed a several options but didn't work

 const toggleButton = document.getElementsByClassName('toggle-button')[0] const topNav = document.getElementsByClassName('top-nav')[0] const search = document.getElementsByClassName('search-box')[0] toggleButton.addEventListener('click',()=> { topNav.classList.toggle('active') & search.style.display('none') })

Answer 1

 const toggleButton = document.getElementsByClassName('toggle-button')[0] const topNav = document.getElementsByClassName('top-nav')[0] const search = document.getElementsByClassName('search-box')[0] toggleButton.addEventListener('click',()=> { topNav.classList.toggle('active') if (search.style.display.= 'none') search.style.display = 'none' else search.style.display = 'block' })

 <div class="top-nav"> <input class="search-box"/> </div> <button class="toggle-button">Toggle</button>