jQueryでは、 ”

empty

“セレクタを使用して、子を持たないすべての要素（内部のテキストも含む）を選択します。

例 

<div class="div-class1">
   This is div-class1
</div>

<div class="div-class2"/>

$（ ‘:empty’） – ”

div-class2

“は一致しますが、 ”

div-class1

“は一致しません。

jQueryの例

jQueryの “空の”セレクタの使い方を示す簡単な例です。 

<html>
<head>
<title>jQuery empty example</title>

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

<style type="text/css">
    div{
        padding:8px;
        border:1px solid;
    }
</style>
</head>

<body>

<h1>jQuery empty example</h1>

<div class="div-class1">
    This is div-class1
</div>

<div class="div-class2"/>

<div class="div-class3">
    This is div-class3
    <div class="div-class3-1">
        This is div-class3-1
    </div>
</div>

<br/><br/>

<button>:empty</button>

<script type="text/javascript">
    $("button").click(function () {
      var str = $(this).text();
      $("** ").css("background", "white");
      $(str).css("background", "coral");
    });
</script>

</body>
</html>


デモを試してください


jquery


jquery selector