生年月日から年齢を計算してサイト上に表示するJavaScript

生年月日から年齢を計算してサイト上に表示するJavaScript

生年月日から年齢を計算

生年月日から年齢を計算してサイト上に表示するJavaScriptライブラリが必要だったのだが良いものがなかったため自作した。

使用方法

https://iwb.jp/s/js/iwbdate.js を読み込んで以下のようにHTMLタグにdata-iwb-date属性を追加して生年月日を入れれば年齢が表示される。

月と日の0は省略可能。/・-・年月日のいづれかで区切る。data-iwb-date属性を付けるタグは何でも良い。

<ul>
<li>譜久村聖 1996年10月30日生まれ <span data-iwb-date="1996年10月30日"></span>歳</li>
<li>生田衣梨奈 1997年7月7日生まれ <span data-iwb-date="1997/7/7"></span>歳</li>
<li>飯窪春菜 1994年11月7日生まれ <span data-iwb-date="1994-11-7"></span>歳</li>
<li>石田亜佑美 1997年1月7日生まれ <span data-iwb-date="1997年1月7日"></span>歳</li>
<li>佐藤優樹 1999年5月7日生まれ <span data-iwb-date="1999/5/7"></span>歳</li>
<li>工藤遥 1999年10月27日生まれ <span data-iwb-date="1999-10-27"></span>歳</li>
<li>小田さくら 1999年3月12日生まれ <span data-iwb-date="1999年3月12日"></span>歳</li>
<li>尾形春水 1999年2月15日生まれ <span data-iwb-date="1999/2/15"></span>歳</li>
<li>野中美希 1999年10月7日生まれ <span data-iwb-date="1999-10-7"></span>歳</li>
<li>牧野真莉愛 2001年2月2日生まれ <span data-iwb-date="2001年2月2日"></span>歳</li>
<li>羽賀朱音 2002年3月7日生まれ <span data-iwb-date="2002/3-7"></span>歳</li>
</ul>

ブログサービスの場合は以下のJavaScriptをHTML内に記述して読み込む。

/*!
 * iwbdate.js JavaScript Library
 * Copyright iwb.jp
 * Released under the MIT license
 * https://iwb.jp/
 */
(function(){document.addEventListener("DOMContentLoaded",function(){document.querySelectorAll("[data-iwb-date]").forEach(function(c){var a=c.getAttribute("data-iwb-date").replace(/\u65e5/g,"");a.match(/\d{1}$/g)&&(a=a.replace(/^(.+?)[^\d](\d)$/g,"$10$2"));var b=new Date,a=a.replace(/[-/\u5e74\u6708\u65e5]/g,""),b=1E4*b.getFullYear()+100*b.getMonth()+100+b.getDate();7===a.length&&(a=a.replace(/(.{4})(.{3})/g,"$10$2"));c.textContent=Math.floor((b-a)/1E4)})})})();

生年月日から年齢を計算してサイト上に表示するJavaScriptサンプル