心理テストのWebページはHTML（Hyper Text Markup Language)　で記述されています。

JavaScriptはHTML内に記述されています。
赤で記述されている言語がJavaScriptです。

 <!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="GENERATOR" content="JustSystems Homepage Builder Version 21.0.1.0 for Windows">
<title></title>
<link rel="stylesheet" type="text/css" href="table117.css" id="HPB_TABLE_CSS_ID_">
</head>
<body>
<h1>心理テスト</h1>
<p><font SIZE="+1">あなたが森の中を一人で散歩していると、ある生き物に出会いました。
その生き物はどれですか？<br>
</font><br>
<img src="mori.jpg" border="0" width="612" height="197"></p>
<table border="1" cellspacing="0" cellpadding="2" id="HPB_TABLE_2_A_221216204100" class="hpb-cnt-tb1" bgcolor="#00ff00">
<tbody>
<tr>
<td class="hpb-cnt-tb-cell1" align="center" bgcolor="#00ff00">&nbsp;鳥</td>
<td class="hpb-cnt-tb-cell1" align="center" bgcolor="#00ff00">&nbsp;リス</td>
<td class="hpb-cnt-tb-cell1" align="center" bgcolor="#00ff00">&nbsp;クマ</td>
<td class="hpb-cnt-tb-cell1" align="center" bgcolor="#00ff00">&nbsp;人間</td>
<td class="hpb-cnt-tb-cell1" align="center" width="119" bgcolor="#00ff00">&nbsp;妖精</td>
</tr>
<tr>
<td class="hpb-cnt-tb-cell2" bgcolor="#00ff00" height="82">&nbsp;<img src="img_i071.gif" width="95" height="69" border="0"></td>
<td class="hpb-cnt-tb-cell2" height="82" bgcolor="#00ff00">&nbsp;<img src="img_i037.gif" width="94" height="73" border="0"></td>
<td class="hpb-cnt-tb-cell2" height="82" bgcolor="#00ff00"><img src="img_i016.gif" width="51" height="91" border="0">&nbsp;</td>
<td class="hpb-cnt-tb-cell2" height="82" bgcolor="#00ff00">&nbsp;<img src="haikingu1.jpg" border="0" width="116" height="87"></td>
<td class="hpb-cnt-tb-cell2" width="119" height="82" bgcolor="#00ff00"><img src="morinoyousei.png" border="0" width="114" height="86"></td>
</tr>
</tbody>
</table>
<p><br>
下の<font SIZE="+2">□</font>内の▼を押し、鳥・リス・クマ・人間・妖精から一つ選択して「回答する」のボタンを押してください。<br>
<br>
※心理テストアプリはプログラミング言語（JavaScript）でこの様に作成されています。<br>
<br>
<a href="JavaScriptNew.html">戻る</a><br>
</p>
<select id="choiceList" size="1">
<option value="0">鳥</option>
<option value="1"><font SIZE="+1">リス</font></option>
<option value="2"><font SIZE="+1">クマ</font></option>
<option value="3"><font SIZE="+1">人間</font></option>
<option value="4"><font SIZE="+1">妖精</font></option>
</select>
<button onclick="showAnswer()">回答する</button>
<hr>
<p id="answer"></p>
<script>
var answerList = [
"友情",
"愛",
"プライド",
"お金",
"夢",
];
function showAnswer(){
var choiceNo = document.getElementById("choiceList").value;
document.getElementById("answer").innerHTML = "";
document.getElementById("answer").innerHTML += "この心理テストは、あなたが一番大切にしているものを表しています。<br>";
document.getElementById("answer").innerHTML += "あなたが一番大切にしているものは、「" + answerList[choiceNo] + "」です。";
}
</script>
<p><br>
</p>
</body>
</html>

HTML言語から、JavaScriptを取り出しました


戻る