Estoy desarrollando mi cartera de desarrolladores web . En eso, cuando presiono la hamburguesa, el color de la barra de navegación superior también debería cambiar. Pero a veces en Chrome no cambia y tengo que recargar. Pensé que probablemente se deba a que el script no se cargó. Pero incluso después de esperar mucho tiempo, se produce este error. ¿Alguien puede decir por qué sucede y cómo solucionarlo? Tenga en cuenta que este cambio de color es solo para la navegación móvil . El código fuente está disponible en https://github.com/mrjithin/my-portfolio/ . Y el script que hace esto está disponible con el nombre ham.js en la carpeta de scripts. El color superior debería haber sido el mismo que el color del resto de la barra de navegación.

 // ham.js // For mobile hamburger const mobNav = document.querySelector("nav#mobile"); const deskNav = document.querySelector("nav.desktop"); const navColor = window.getComputedStyle(mobNav).getPropertyValue("background-color"); document.getElementsByClassName("ham")[0].addEventListener("click", (event) => { document.getElementsByClassName("ham")[0].classList.toggle("cross"); document.getElementById("line2").classList.toggle("none"); mobNav.classList.toggle("on"); mobNav.classList.toggle("off"); if(mobNav.className === "on"){ deskNav.style.backgroundColor = navColor; } else { deskNav.style.backgroundColor = ""; } event.stopPropagation(); }); // To close the navbar on clicking a link. const mobileLis = document.querySelectorAll("nav#mobile a"); Array.from(mobileLis).forEach(link => { link.addEventListener("click", event => { document.getElementsByClassName("ham")[0].classList.toggle("cross"); document.getElementById("line2").classList.toggle("none"); mobNav.classList.toggle("on"); mobNav.classList.toggle("off"); if(mobNav.className === "on"){ deskNav.style.backgroundColor = navColor; } else { deskNav.style.backgroundColor = ""; } event.stopPropagation(); }) })

¡Gracias por adelantado!