JavaScriptを使って生年月日から逆算して現在の年齢を表示する方法 DAD UNION

JavaScriptを使って生年月日から逆算して現在の年齢を表示する方法をご紹介します。

Contents

生年月日から逆算して現在の年齢を表示するCSSの記述
生年月日から逆算して現在の年齢を表示するHTMLとJavaScriptの記述
JavaScriptを使って生年月日から逆算して現在の年齢を表示するデモページ

生年月日から逆算して現在の年齢を表示するCSSの記述

※年齢出力先要素（.birthage）のCSS記述です。必要に応じて変更して下さい。

<style>
body {
  margin: 20px 10px;
  padding: 0;
  font-size: 18px;
  text-align: center;
}
h1{
  text-align: center;
  font-size: 22px;
  line-height: 2em;
  padding-bottom: 20px;
}
.birthage{
  text-align: center;
  font-size: 28px;
  font-weight: bold;
  color: red;
  padding: 15px 0;
}
</style>

生年月日から逆算して現在の年齢を表示するHTMLとJavaScriptの記述

※生年月日から年齢を返す関数getage(西暦,月,日付)を用意しました。getage()関数ではDate()を使って今年の誕生日を取得し、そこから年齢を計算してます。document.write()でgetage()からの返り値（年齢）を出力してます。

<h1>JavaScriptを使って生年月日から逆算して現在の年齢を表示</h1>

<div align="center">1992年1月15日生まれの人は現在以下の年齢になります。</div>

<script type="text/javascript">
function getage(y,m,d){
    var today = new Date(); //今日の日付を取得
    var thisYearsBirthday = new Date(today.getFullYear(), m-1, d);  //今年の誕生日を取得
    var age = today.getFullYear() - y;  //年齢を取得
    //今年まだ誕生日が来てない場合-1
    if(today < thisYearsBirthday){
        age--;
    }
    return age;
}

y=1992;
m=1;
d=15;
document.write('<div class="birthage">'+getage(y,m,d)+'歳</div>');
</script>