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>
コメント