親フォルダ タブ
<!DOCTYPE html>
<html>
<head>
<meta content="width=device-width initial-scale=1.0 minimum-scale=1.0 maximum-scale=1.0 user-scalable=no" name="viewport">
<meta charset="UTF-8">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.1/css/bootstrap.css">
</head>
<body>
<h1>JavaScriptの練習</h1>

<input type="text" id="gakusei" value="123456">

<script>
function test() {
	var gakusei = document.getElementById("simei").value;

	alert(gakusei);
}

</script>

<input type="text" id="simei" value="山田 太郎">

<input type="button" id="btn" value="実行" onclick="test()">


</body>
</html>
JavaScript のイベント

要素の中にイベントプロパティを記述し、値として JavaScript のコードを記述します
onclick="test()"
test() は JavaScript のコードで、定義済の関数を呼び出しています id プロパティによる参照 id は、唯一のオブジェクトになる対象に設定され、document.getElementById メソッドによって使用されます。
基本的な事
1) SCRIPT 要素の中に書く
2) ページの上から下へ実行される
3) 画面のコントロールは id で参照する
4) 実行ブロックは、function 関数名() {} で定義される
5) 関数呼び出しは 関数名() で実行される
デベロッパーツール
1) デベロッパーツールは F12 で開く
2) Elements タブで画面を Inspect して情報を得る
3) Console タブでエラーを見る
4) Console に直接入力して JavaScript を実行する