blog/source/_posts/作品/工具/身体质量指数.md
2022-09-03 17:41:14 +08:00

113 lines
2.7 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

---
title: 身体质量指数
categories:
- 作品
- 工具
keywords:
- 健康
tags:
- JavaScript
date: 2022-09-02 17:12:35
mathjax: true
---
身体质量指数Body Mass Index简称BMI简称体质指数是由一个人的质量体重和身高计算出的一个数值。BMI的定义是体重除以身高的平方以千克/平方米为单位表示,由质量(千克)和身高(米)得出:
$$ BMI = { 体重 \over 身高 ^ {2} } $$
身体质量指数是国际上衡量人体胖瘦程度以及是否健康的一个常用指标BMI正常值在20至25之间超过25为超重30以上则属肥胖。
## 计算器
<style>
#calculator,
#calculator * {
margin: 10px auto;
box-sizing: border-box;
}
#calculator,
#calculator button {
width: 300px;
}
#calculator label,
#calculator input {
width: 150px;
color: black;
display: inline-block;
}
button {
cursor: pointer;
}
</style>
<div id="calculator">
<div><label for="weight">体重(千克):</label><input id="weight" type="text" autocomplete="off"></div>
<div><label for="weight">身高(厘米):</label><input id="height" type="text" autocomplete="off"></div>
<div><label>您的BMI</label><input id="bmi" type="text" disabled></div>
<button onclick="calculate()">计算</button>
</div>
<script>
bmi.value = 0
function calculate() {
const w = Number(weight.value)
const h = Number(height.value) / 100
bmi.value = (isNaN(w) || isNaN(h) || !h) ? 0 : (Math.round(w / h ** 2)).toFixed(1)
}
</script>
<!-- more -->
## 源码
``` html
<style>
#calculator,
#calculator * {
margin: 10px auto;
box-sizing: border-box;
}
#calculator,
#calculator button { width: 300px; }
button { cursor: pointer; }
#calculator label,
#calculator input {
width: 150px;
color: black;
display: inline-block;
}
</style>
<div id="calculator">
<div>
<label for="weight">体重(千克):</label>
<input id="weight" type="text" autocomplete="off">
</div>
<div>
<label for="weight">身高(厘米):</label>
<input id="height" type="text" autocomplete="off">
</div>
<div>
<label>您的BMI</label>
<input id="bmi" type="text" disabled>
</div>
<button onclick="calculate()">计算</button>
</div>
<script>
bmi.value = 0
function calculate() {
const w = Number(weight.value)
const h = Number(height.value) / 100
bmi.value = (isNaN(w) || isNaN(h) || !h) ? 0 : (Math.round(w / h ** 2)).toFixed(1)
}
</script>
```