【JS】定義リスト/記述リスト（dl, dd）タグの個数をカウントするスクリプトをjQueryで作ってみた

2018/01/05 2018/09/10

このブログの一番人気記事である「三文字略語」のページには現在何個の略字を載っけたのか数えたくなったのですが、いちいち自分で数えるのもバカらしく感じたのでプログラムにやらせてみようと作ってみました。また違うところで使えそうだったので、スクリプト内容を備忘録代わりにポストしておきます。

定義リストの個数をカウントするスクリプト

単純にlengthで数えることにしました。
jQueryを先に読み込ませてください。

<script>
$(function() {
    var cnt = $('dd').length;
    $('.kosu').text(cnt + '個');
});
</script>

$(function() {

var cnt = $('dd').length;

$('.kosu').text(cnt + '個');

});

</script>

たかだか4行のスクリプトですが、しっかりと動きました。

上に書いたままだと、ページ内の全ての dd タグの個数を出力されるので、対象タグをラップするボックスを用意した方が良さそうです。
三文字略語のページでは sanmoji というクラス名の div タグでラップしました。

デモはこちらから。

: jQueryでサムネイル画像をマウスオーバーするとメイン画像が入れ替わるスクリプトを書いてみた

ECサイトでよくある、サムネイル画像にカーソルを合わせると、メイン画像が入れ替わるというスクリプトをjQueryを使い書いてみたので、公開してみます。プラグイン化もしてみました。

: 【JS】スクロールしたら画面途中にあるグローバルナビを画面上部に固定する方法

トップページなどで、動画や画像コンテンツの下に配置してあったグローバルナビを、スクロールしたら画面上部に固定して表示するスクリプトを作成したので、備忘録を兼ねて紹介します。

: 【JS】「コナミコマンド」入力でアクションを起こすスクリプトを作ってみた

以前より作ってみたかった「コナミコマンド」スクリプトを、時間が空いたところで作ってみました。

: 多角レーダーチャートを作成する「Jquery Canvas Chart」を使ってみた。

作成しているシステムのとある一覧画面に、得点に応じたチャート図をつけて欲しいとの依頼があったので、色々と調べてみたのですが、「Jquery Canvas Chart」が簡単でわかり易かったのでご紹介。