この記事では、Javascriptで和暦(明治・昭和・大正・平成)と西暦を相互に変換する方法とソースコードについて紹介します。
## 和暦・西暦の相互変換
Javascriptでは、和暦(明治・昭和・大正・平成)を西暦に変換するオブジェクトもあります。
変換は簡単なので今回は関数を自作してみました。
## ソースコード
サンプルプログラムのソースコードです。
Javascript
■main.js
function wareki2seireki(nengo, wareki)
{
if ((nengo == "平成") && (wareki > 0))
{
return parseInt(wareki) + 1988;
}
else if ((nengo == "昭和") && (wareki > 0) && (wareki <= 64))
{
return parseInt(wareki) + 1925;
}
else if ((nengo == "大正") && (wareki > 0) && (wareki <= 15))
{
return parseInt(wareki) + 1911;
}
else if ((nengo == "明治") && (wareki > 0) && (wareki <= 45))
{
return parseInt(wareki) + 1867;
}
else{}
}
function seireki2wareki(year)
{
if (year > 1988)
{
return "平成" + (year - 1988);
}
else if (year > 1925)
{
return "昭和" + (year - 1925);
}
else if (year > 1911)
{
return "大正" + (year - 1911);
}
else if (year > 1988)
{
return "明治" + (year - 1867);
}
else{}
}
// 初期化
function createAssArray(min, max)
{
var srcArray = [];
// srcArrayにmin~maxまでの値を挿入
for(var i = min; i <= max; i++)
{
srcArray[i] = i + '年';
}
return srcArray;
}
function setSelect( idName, elementName, menu )
{
// 入力ボックスの値を取得
var id = document.getElementById(idName);
// メニュー項目のセット
for ( var i in menu )
{
var element = document.createElement(elementName);
element.setAttribute('value', i);
element.innerHTML = menu[i];
id.appendChild( element );
}
}
// 初期化
function init()
{
// 連想配列
var nengo = {
'昭和' : '昭和',
'大正' : '大正',
'明治' : '明治'
};
var nengoYear = createAssArray(2, 62);
var seirekiYear = createAssArray(1931, 2017);
// selectの初期化
setSelect( 'nengo', 'option', nengo );
setSelect( 'nengoYear', 'option', nengoYear );
setSelect( 'seirekiYear', 'option', seirekiYear );
}
// 西暦→和暦
function ToWareki()
{
// 入力ボックスの値を取得
var seireki = document.toWareki.seireki.value;
wareki = seireki2wareki(seireki);
var result = "西暦" + seireki + "年 → " + wareki + "年"
// 結果表示
document.result.box.value = result + "\n" + document.result.box.value;
}
// 和暦→西暦
function ToSeireki()
{
// 入力ボックスの値を取得
var nengo = document.toSeireki.nengo.value;
var nengoYear = document.toSeireki.nengoYear.value;
seireki = wareki2seireki(nengo, nengoYear);
result = nengo + nengoYear +"年 → 西暦" + seireki + "年"
// 結果表示
document.result.box.value = result + "\n" + document.result.box.value;
}
HTML
■index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<!--外部ファイルに記述-->
<pre type="text/javapre" src="main.js"></pre>
<link rel='stylesheet' href='style.css' type='text/css' media='all'/>
</head>
<body onload="init();">
<!-- 年号→西暦 -->
<form name="toSeireki">
<select id="nengo" name="nengo">
<option value="平成">平成</option>
</select>
<select id="nengoYear" name="nengoYear">
<option value=1>1年</option>
</select>
<input type="button" id="toWarekiButton" value="西暦に変換" onclick="ToSeireki();"/>
</form>
<br>
<!-- 西暦→年号 -->
<form name="toWareki">
西暦 <select id="seirekiYear" name="seireki">
<option value=1931>1931年</option>
</select>
<input type="button" id="toWarekiButton" value="和暦に変換" onclick="ToWareki();"/>
</form>
<br>
<form name="result">
<textarea id="result" name = "box" value="ここに結果が表示されます。"/></textarea>
</form>
</body>
</html>
CSS
■style.css
body {
background:#222;
color:#eee;
}
#nengo, #nengo-year, #seireki-year{
background:#444;
border:solid 1px #666;
color:#eee;
}
#to-wareki-button, #to-seireki-button {
background:#555;
border:solid 1px #888;
color:#eee;
}
#to-wareki-button:hover, #to-seireki-button:hover {
background:#00aa00;
}
#result{
background:#333;
border:solid 1px #4a4a4a;
color:#eee;
width:300px;
height:300px;
}
## 実行結果
サンプルプログラムの実行結果は以下の通りです。
変換ボタンを押すと下に和暦⇔西暦の変換結果が表示されます。
【関連記事】
Javascript入門 基本文法
コメント