jquery – 有没有办法通过向父级添加内联样式来隐藏父div /容器内的所有div?

前端之家收集整理的这篇文章主要介绍了jquery – 有没有办法通过向父级添加内联样式来隐藏父div /容器内的所有div?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图通过向父div添加内联样式来确定是否可以隐藏父容器内的所有子div.我尝试了两种可见性:隐藏;并显示:无;似乎没有人隐藏孩子的div.我以为我可以使用一些 jquery循环遍历所有子div并为每一个添加内联样式,尽管我认为必须有一种方法可行.

这是一个例子:

CSS

.hero-content {
      text-align: center;
      height: 650px;
      padding: 80px 0 0 0;
    }

    .title,.description {
      position: relative;
      z-index: 2
    }

HTML

<div class="hero-content">
   <div class="title"> This is a title </div>  
   <div class="description"> This is a description</div>  
</div>

解决方法

您不能在父元素上使用内联样式隐藏子元素,因此请使用display:none;对于您的子元素,您不需要内联样式来执行此操作
.hero-content > div.title,.hero-content > div.description {
   display: none;
}

或者如果您使用jQuery解决方案,那么将一个类添加到父元素,然后使用下面的选择器.

.hide_this > div.title,.hide_this > div.description {
   display: none;
}

现在使用jQuery在父元素上添加.hide_this类.

$(".hero-content").addClass("hide_this");

Demo(使用.addClass())

或者,如果你是内联风格的粉丝而不是这里

$(".hero-content .title,.hero-content .description").css({"display":"none"});

Demo 2

原文链接:https://www.f2er.com/jquery/176250.html

猜你在找的jQuery相关文章