[jQuery] eachでリストの要素数を数える

photo_00335

jQueryを使ってリストの数を数えてみます。

jQueryにはeachメソッドというものが用意されており、これを使うと簡単に処理できます。

eachメソッド

eachメソッドは要素を1つずつ処理します。

XHTML

HTMLはulとliを使ったシンプルなリストになります。ulのクラス名はsampleに設定します。

表示

  • aaa
  • bbb
  • ccc
  • ddd
  • eee

HTMLを表示するとこのようになります。

jQuery

$(‘.sample li’).each(function () {}でクラス名sampleの中のli要素を1つずつ処理します。
1個処理するごとにカウンターの数を1ずつ上げていきます。

アラートで要素の数を表示させます。

結果
リスト数の取得
今回はリスト数が5なので、「5」と表示され、プログラムが正しく動いているのが確認できます。

  • Categories

  • タグ

  • アーカイブ

  • 最近の投稿