JSを使ってBMI測定アプリを作成しよう。
[実行例]
フォーム表示
身長と体重を入力して計測ボタンを押すと結果が表示される。
なおBMIは
体重kg/(身長m*身長m)
で求められ
判定基準は以下とする。
18.5未満 低体重
18.5～25未満 普通
25～30未満 肥満（1度）
30～35未満 肥満（2度）
35～40未満 肥満（3度）
40以上 肥満（4度）
[作例]
●index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>BMI測定</title>
</head>
<body>
身長(cm):<input type="number" step="0.1" id="height"><br>
体重(kg):<input type="number" step="0.1" id="weight"><br>
<button id="calc" onclick="calc()">計測</button>
<div id="result"></div>
<script>
'use strict';
var eleHeight=document.getElementById("height");
var eleWeight=document.getElementById("weight");
var result=document.getElementById("result");
function calc(){
var height=parseFloat(eleHeight.value);
height/=100;
var weight=parseFloat(eleWeight.value);
var bmi=weight/(height*height);
var judge;
if(bmi>=40){
judge='肥満4';
}else if(bmi >=35){
judge='肥満3';
}else if(bmi >=30){
judge='肥満2';
}else if(bmi >=25){
judge='肥満1';
}else if(bmi >=18.5){
judge='普通体重';
}else{
judge='低体重';
}
result.innerHTML='BMI:'+bmi.toFixed(2)+"<br>"+judge+'です。';
}
</script>
</body>
</html>
コメント