Created
December 14, 2022 14:33
-
-
Save kat0h/a5274a4cabd68b297f1678100c35a991 to your computer and use it in GitHub Desktop.
BMI計算 HTML
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> | |
</head> | |
<body> | |
<!-- 入力 --> | |
<label for="sincho">身長 (50-200 cm):</label> | |
<input type="number" id="sincho" min="50" max="200"> | |
<br> | |
<label for="taiju">体重 (20-100 kg):</label> | |
<input type="number" id="taiju" min="20" max="100"> | |
<br> | |
<!-- 出力 --> | |
BMIは...<span id="bmi"></span> | |
<br> | |
適正体重は...<span id="tekisei"></span>kg | |
<br><br> | |
<!-- ボタン --> | |
<button onclick="calc()">計算</button> | |
<button onclick="clear_value()">クリア</button> | |
</body> | |
<script> | |
// 入力から数字を取ってくるための下準備 | |
const sincho_box = document.getElementById("sincho") | |
const taiju_box = document.getElementById("taiju") | |
const round = Math.round // 切捨てしてくれる便利関数 | |
// 計算ボタンが押されると実行される | |
function calc() { | |
// 入力の中身の数字を取ってくる | |
const sincho = sincho_box.value / 100 | |
const taiju = taiju_box.value | |
// 計算 | |
const bmi = taiju / (sincho ** 2) | |
const tekisei = (sincho ** 2) * 22 | |
// 出力に値を入れる | |
document.getElementById("bmi").innerText = round(bmi) | |
document.getElementById("tekisei").innerText = round(tekisei) | |
} | |
// クリアボタンが押されると実行される | |
function clear_value() { | |
sincho_box.value = null | |
taiju_box.value = null | |
} | |
</script> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment