Javascript 使用js播放视频时隐藏导航

我有一个客户，他用wpbakery建立了他们的网站，并且在他们的帖子上使用了视频播放器。他们希望在视频播放时导航条消失。在inspector中，我可以看到播放器有一个“视频容器”类，当视频播放时，还有一个“播放”类。我希望检查视频容器是否正在播放，然后向我的导航添加一个类

var hideNav = document.getElementsByClassName('video-container playing');
if (hideNav) {
    document.getElementByClassName("nav").className = "hidden";
}

---

我猜我需要添加一个事件侦听器，我不确定我的hideNav变量是否按我所希望的方式工作。

以下是一个不使用jQuery的答案：

const videoEl=document.getElementById'video' const navbrel=document.getElementById'navbar' videoEl.addEventListener'play'，=>{ navbrel.classList.add'hidden' } videoEl.addEventListener'pause'，=>{ navbrel.classList.remove'hidden' } .隐藏{ 显示：无； } 导航栏

---

下面是一个不使用jQuery的答案：

const videoEl=document.getElementById'video' const navbrel=document.getElementById'navbar' videoEl.addEventListener'play'，=>{ navbrel.classList.add'hidden' } videoEl.addEventListener'pause'，=>{ navbrel.classList.remove'hidden' } .隐藏{ 显示：无； } 导航栏

---

非常感谢您的快速回复！这在iframes中是如何工作的？这是我试图隐藏导航的页面。当我尝试const videoEl=document.getElementById'iframe-player-2'videoEl.addEventListener'play'、=>{console.log'video playing'}videoEl.addEventListener'pause'、=>{console.log'video not playing'}`时，它不起作用了，非常感谢您的快速响应！这在iframes中是如何工作的？这是我试图隐藏导航的页面。当我尝试const videoEl=document.getElementById'iframe-player-2'videoEl.addEventListener'play'，=>{console.log'video playing'}videoEl.addEventListener'pause'，=>{console.log'video not playing'}时，它不起作用