jQuery以前ここで「jQueryで入力フォームに文字カウント(カウントダウン)を設置する方法」と題して入力フォームの文字数の値(value)を取得して文字数カウントダウンを設置する方法を紹介しましたがvalueの値ではなくて<p>タグなど通常のコンテンツ要素の文字数の値を取得するやり方について紹介してみます。jQueryでコンテンツ要素の文字数を取得するパターンまずシンプルな記述方法として◆SCRIPT$(●●●●).text().length;単純にこれだけの記述でコンテンツ要素の文字数は取得することができます。使用する場面によっては実際に取得したい値と変わってきてしまう可能性もあるかと思います。その様な場合で、文字列の中のスペースや改行は文字数カウントに含めないように取得する場合の記述方法は以下の様になります。◆SCRIPT$(●●●●).text().replace(/\s+/g,'').length;この様な記述にすることによって文字列の中のスペースや改行を省いた値での文字数カウントを取得することが可能になります。くけこ</p>この<p>タグ内の文字列を上記の2パターンで取得する場合のスクリプトは◆SCRIPT$('p').text().length;$('p').text().replace(/\s+/g,'').length;この様になり、これらを実行させて値をページ上に表示すると以下のような感じになります。スペースや改行を含めた「$(●●●●).text().length;」とスペースや改行を省いた「$(●●●●).text().replace(/\s+/g,”).length;」でのそれぞれの値の違いが確認できると思います。使用する場面でそれぞれ使い分けに注意する必要があるかと思いますがスクリプト処理でテキストも文字数の値が必要になった際にぜひ。※コメントにHTMLタグを直接入力しないでください。※HTMLタグを入力する際はタグ一つ一つの括弧「<」「>」を全角に変換して入力してください。コメントは承認制になっているのですぐには反映されません。コメント頂いた内容については出来る限り早めの対応を心掛けていますが、時期によって返答が遅くなってしまうことがありますので、何卒ご了承ください。Webサイト構築に関する技術やWebサービスを紹介するブログです。jQueryをはじめとしたWebサイトを彩る技術のほか、HTML(HTML5)、CSS(CSS3)、iPhoneやTwitterを使った実験などなど、Webサイト制作に役立つであろうと思われる情報を備忘録として掲載しています。