循环通过父元素，如果子元素不存在显示文本 [英] Loop through parent elements and if child element doesnt exist display text

问题描述

我想弄清楚如何循环遍历所有的父类（.grid），如果它没有类（.image-container）的子div，然后显示（.content-container）在同一个。网格）部分。

I'm trying to figure out how to loop through all parent classes (.grid) and if it doesnt have a child div with class (.image-container) then display (.content-container) within the same (.grid) section.

HTML ：

<style>
.grid .content-container {
    display:none;
}
</style>

<div class="grid">
    <div class="art">
        <div class="image-container">
            <img src="image url" />
        </div>
        </div>
        <div class="title">Title Text</div>
        <div class="content-container">Some Content Goes here</div>
</div>
<div class="grid">
    <div class="art"></div>
        <div class="title">Title Text</div>
        <div class="content-container">Some Content Goes here</div>
</div>
<div class="grid">
    <div class="art">
        <div class="image-container">
            <img src="image url" />
        </div>
        </div>
        <div class="title">Title Text</div>
        <div class="content-container">Some Content Goes here</div>
</div>
<div class="grid">
    <div class="art">
        <div class="image-container">
            <img src="image url" />
        </div>
        </div>
        <div class="title">Title Text</div>
        <div class="content-container">Some Content Goes here</div>
</div>
<div class="grid">
    <div class="art"></div>
        <div class="title">Title Text</div>
        <div class="content-container">Some Content Goes here</div>
</div>

< div class =art>
< div class =image-container>
< img src =image url/>
< / div>
< / div>
< div class =title>标题文字< / div>
< div class =content-container>部分内容会出现在这里< / div>
< / div>
< div class =grid>
< div class =art>
< div class =image-container>
< img src =image url/>
< / div>
< / div>
< div class =title>标题文字< / div>
< div class =content-container>部分内容会出现在这里< / div>
< / div>
< div class =grid>
< div class =art>< / div>
< div class =title>标题文字< / div>
< div class =content-container>部分内容会出现在这里< / div>
< / div>

推荐答案

这样应该可以工作：

这篇关于循环通过父元素，如果子元素不存在显示文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！