使用 jquery 隐藏除一个子 div 以外的所有元素,包括其子元素


div

下有一个具有 myDiv 类的视频播放器。我想隐藏整个网站,只想显示视频,即myDiv及其子级。如何使用jQuery或JavaScript来做到这一点。

<body>
   <header></header>
   <main>
      <section></section>
      <section>
        <div class="myDiv">
           <div></div>
           <div</div>
        </div>
      </section>
      <section></section>
   </main>
   <footer></footer>
</body>

您可以给视频div一个类,给其他每个div一个隐藏类并编写代码,以便在单击它播放时,它会隐藏其他所有内容。

所以在你的jQuery中

$('.videoClass').click(function(){
 $('.hide').css('display','none');
});

您可以添加一个切换开关,以便当您再次单击它时,它会显示所有隐藏的div。

尝试使用

jquery 的filter()函数

$('section').filter(function(){
 return $(this).find('.myDiv').length == 0 //its hiding except myDiv
}).hide()
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
  <main>
    <section>first</section>
    <section>second contains myDiv
      <div class="myDiv">its a my div
        <div>i m child of myDiv</div>
        <div>i m child of myDiv</div>
      </div>
    </section>
    <section>Third</section>
  </main>
</body>

最新更新