divが空であるかどうかをチェックする前または：after

Question

divが空の場合は、Jqueryでチェックする必要があります。beforeまたは：after、beforeまたはafterを持つdivでこれを行います。 ：前または：

$(function(){ 
 
    if($('#content').not(':empty')) { 
 
    console.log('Yes content'); 
 
    } else {  
 
    console.log('No content'); 
 
    } 
 
});

#content:empty { 
 
    position: relative; 
 
    display: block; 
 
    min-height: 200px; 
 
    background-color: rgb(240,240,240); 
 
    text-align: center; 
 
} 
 

 
#content:empty:before { 
 
    content: 'NO IMAGE'; 
 
    position: absolute; 
 
    font-size: 25px; 
 
    left: 0; 
 
    right: 0; 
 
    top: 50%; 
 
    transform: translateY(-50%); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="content"></div>

Answer 1

後あなたは、次を使用してHTMLやテキストをチェックすることもできます

$(function(){ 
 
    if($('#content').html() || $('#content').text()){ 
 
    console.log('Yes content'); 
 
    } else {  
 
    console.log('No content'); 
 
    } 
 
});

#content:empty { 
 
    position: relative; 
 
    display: block; 
 
    min-height: 200px; 
 
    background-color: rgb(240,240,240); 
 
    text-align: center; 
 
} 
 

 
#content:empty:before { 
 
    content: 'NO IMAGE'; 
 
    position: absolute; 
 
    font-size: 25px; 
 
    left: 0; 
 
    right: 0; 
 
    top: 50%; 
 
    transform: translateY(-50%); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="content"></div>

の

例：空の

：テキスト付き

<div id="content"></div> 

：HTMLで

<div id="content">Hello World</div> 

：

<div id="content"> 
    <span class="child"></span> 
</div>