*

全ての要素を選択します。

$( * ) 1.0追加

デモ

BODYやHEADを含む全ての要素が選択されます。 また、ブラウザのアドオンや拡張機能によって追加された<script>や<link>すらも 対象になることに注意してください。

<!DOCTYPE html>
<html>
<head>
<style>
  h3 { margin: 0; }
  div,span,p {
    width: 80px;
    height: 40px;
    float:left;
    padding: 10px;
    margin: 10px;
    background-color: #EEEEEE;
  }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div>DIV</div>
<span>SPAN</span>
<p>P <button>ボタン</button></p>
<script>
  var elementCount = $("*").css("border","3px solid red").length;
  $("body").prepend("<h3>" + elementCount + " 個の要素が見つかりました</h3>");</script>
</body>
</html>

ID:testのDIV要素内の全ての要素に対してCSSを変更し、対象個数を取得しています。

<!DOCTYPE html>
<html>
<head>
<style>
  h3 { margin: 0; }
  div,span,p {
    width: 80px;
    height: 40px;
    float:left;
    padding: 10px;
    margin: 10px;
    background-color: #EEEEEE;
  }
  #test {
    width: auto; height: auto; background-color: transparent;
  }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div id="test">
<div>DIV</div>
<span>SPAN</span>
<p>P <button>ボタン</button></p>
</div>
<script>
  var elementCount = $("#test").find("*").css("border","3px solid red").length;
  $("body").prepend("<h3>" + elementCount + " 個の要素が見つかりました</h3>");
</script>
</body>
</html>

 Back to top

© 2010 - 2017 STUDIO KINGDOM