英単語と和訳
ボタンを押す度に、英単語とその和訳を順番に表示します。
<!DOCTYPE html>
<html>
<head>
<title>英単語と和訳</title>
<script>
window.onload = function() {
var words = [
['apple', 'りんご'],
['banana', 'バナナ'],
['car', '車'],
['dog', '犬'],
['egg', '卵'],
['flower', '花'],
['grape', 'ブドウ'],
['horse', '馬'],
['ice cream', 'アイスクリーム'],
['juice', 'ジュース'],
['kiwi', 'キウイ'],
['lemon', 'レモン'],
['melon', 'メロン'],
['notebook', 'ノート'],
['orange', 'オレンジ'],
['pizza', 'ピザ'],
['queen', '女王'],
['rainbow', '虹'],
['strawberry', '苺'],
['tea', '紅茶'],
['umbrella', '傘'],
['violin', 'バイオリン'],
['watermelon', '西瓜'],
['xylophone', '木琴'],
['yakitori', '焼き鳥'],
['zebra', 'シマウマ']
];
var index = 0;
var btn = document.getElementById('btn');
var wordElem = document.getElementById('word');
var translationElem = document.getElementById('translation');
btn.onclick = function() {
if (index >= words.length) {
wordElem.innerHTML = '単語が終了しました';
translationElem.innerHTML = '';
btn.disabled = true;
} else {
wordElem.innerHTML = words[index][0];
translationElem.innerHTML = words[index][1];
index++;
}
};
};
</script>
</head>
<body>
<h1>英単語と和訳</h1>
<p>ボタンを押す度に、英単語とその和訳を順番に表示します。</p>
<p id="word"></p>
<p id="translation"></p>
<button id="btn">次へ</button>
</body>
</html>
<!-- ジョーク: 隠し英単語モードを実装することができます。ただし、全ての和訳は日本酒に関するものになります。 -->