js入門クイズアプリ制作（途中）

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>三択クイズ</title>
</head>

<body>
	<h1>三択クイズ</h1>
	<hr>
	<h2>問題</h2>
	<div id="text_q"></div>
	<h2>選択</h2>
	<div id="text_s"></div>
	<h2>解答</h2>
	<div id="text_a"></div>
</body>
</html>

<script type="text/javascript">
//問題と回答のオブジェクト
	//qa = [問題文, 選択肢1, 選択肢2, 選択肢3, 正解の番号]
	var qa = [3];
		qa[0] = ["LIFE PEPPERの創業日は？", "1996/03/23", "2014/04/02", "2020/01/23", 2]
		qa[1] = ["千駄ヶ谷オフィスを使ったことがないのは誰？", "イム・イクジェ", "對馬聖哉", "斉藤諒", 1]
		qa[2] = ["吉田さんの下の名前の漢字はどれ？", "行広", "行弘", "行宏", 3]
	//qa っていう変数にいくつもデータを入れたいときには、　var qa = [3];　って書かないといけない。3つデータあるよって意味。
	//さらに、qaの箱が3つできたわけなので、0番からそれぞれどういうデータを持っているのかを指定してあげる必要がある。上みたいに。
	console.log(qa[1]);
	//正しく動いているかの確認には、console.logを使用する。console.log()で()の中に 変数[番号]　を入れてあげると、その順番に入ってるデータが確認できる。

//初期設定
	count = 0;//問題の番号をカウントする変数を設定
	qaSel = 3;//回答の選択肢数をしているする変数を設定。
	//ちなみに、qaSel っていう２つの単語を組み合わせた際に、後ろの単語の1文字目を大文字にするのをcamel なんとかっていうらしい。ラクダ式。

//最初の問題
	quiz();
	//多分これは、quizっていうメソッドを実行するっていう意味。

//問題表示のquizのメソッドを作成
	function quiz(){
		document.getElementById("text_q").innerHTML = (count + 1)+"問目："+ qa[count][0]
	}
	//function メソッドの名前の変数(){命令を書く}で、オリジナルのメソッドを作れるっぽい。メソッドじゃないのか？知らんけど、短文で呼び出せる命令を新規で作成できる。
	// window.document っていうブラウザ側のオブジェクトを呼び出して、その中のgetElementById 要素をIDから引っ張ってきて、そのタグの中身の部分だけをinnerHTMLで書き換える。っていう処理。
	// + qa[count][0] の意味がわからないが、予想ではcount に1を足して、問題数を数えているんじゃないかと思う。
</script>
トドコロリョウ

js入門クイズアプリ制作（途中）

Leave a Reply Cancel reply
