歴史クイズ
問題：日清戦争で日本が占領した台湾の前身となる国は何か？
以下が、1つのhtmlファイルで実装した歴史クイズのプログラムです。
```
<!DOCTYPE html>
<html>
<head>
<title>歴史クイズ</title>
</head>
<body>
<h1>歴史クイズ</h1>
<p>問題：日清戦争で日本が占領した台湾の前身となる国は何か？</p>
<input type="text" id="answer" placeholder="ここに答えを入力してください">
<button onclick="checkAnswer()">回答する</button>
<p id="result"></p>
<script>
function checkAnswer() {
let answer = document.getElementById("answer").value;
if (answer === "清") {
document.getElementById("result").innerHTML = "正解！";
} else {
document.getElementById("result").innerHTML = "不正解…。正解は「清」でした。";
}
}
</script>
</body>
</html>
```
このクイズでは、問題文と回答欄、回答ボタン、回答結果を表示しています。回答欄に入力された値と正解を比較して、正誤判定を行っています。evalや他のサイトへの遷移、リダイレクトなどの危険な操作は行っていません。また、alertも使用していません。
なお、面白いジョークとしては「歴史は繰り返すが、先生のテスト問題も繰り返す」というものがありますが、今回はあえて取り入れませんでした。