【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 タグでラップしました。

デモはこちらから。

: 【JS】スマホ用のQ&AページをslideToggleを使って作ってみる

「よくある質問」のページがやたらと長くなるのが気になり、jQuery の slideToggle を使い、ずらっと並べた質問文をクリック（タップ）したら回答部分がアコーディオン形式で表示されるようにしてみました。この先、絶対にまた使うことだと思うので、備忘録も兼ねてのポストとします。

: 【jQuery】フォームの値を取得 / チェックするスクリプト

jQueryを使い、フォーム内容が埋まっているか、選択されているかなどをチェックする方法のメモ。

: 【JS】マウスオーバーでブロックごとスライドしてくるナビゲーションバーをjQueryで組んでみた

マウスオーバーすると画面外に隠れていたナビゲーションバー、HTMLでいうところのリストタグでできた部分がスライドして出てくるスクリプトは調べていていくつか見たのですが、メニュー部分そのもの（HTMLでいうところのULタグ）が出てくるってのは見かけなかったので、自分で作ってみました。

: 【JS】JavascriptのsetInterval()を使ってストップウォッチを作ってみる

一定時間ごとに処理を行う、JavascriptのsetInterval関数を使ったストップウォッチを作ってみましたので、その備忘録を兼ねたポストです。