当前位置:首页 > JavaScript

js实现Bmi计算

2026-02-02 21:42:50JavaScript

以下是用JavaScript实现BMI计算的几种方法:

js实现Bmi计算

基础计算函数

function calculateBMI(weight, height) {
    const bmi = weight / (height * height);
    return bmi.toFixed(2);
}

完整BMI计算器(带分类)

function getBMICategory(bmi) {
    if (bmi < 18.5) return 'Underweight';
    if (bmi < 25) return 'Normal weight';
    if (bmi < 30) return 'Overweight';
    return 'Obese';
}

function fullBMICalculator(weightKg, heightM) {
    const bmi = calculateBMI(weightKg, heightM);
    const category = getBMICategory(bmi);
    return { bmi, category };
}

带单位转换的计算器

function calculateBMIWithUnits(weight, height, unitSystem = 'metric') {
    let weightKg = weight;
    let heightM = height;

    if (unitSystem === 'imperial') {
        weightKg = weight * 0.453592;  // 磅转千克
        heightM = height * 0.0254;    // 英寸转米
    }

    return calculateBMI(weightKg, heightM);
}

HTML页面集成示例

<!DOCTYPE html>
<html>
<head>
    <title>BMI Calculator</title>
</head>
<body>
    <div>
        <label>Weight (kg): <input type="number" id="weight"></label>
        <label>Height (m): <input type="number" id="height"></label>
        <button onclick="calculate()">Calculate BMI</button>
        <div id="result"></div>
    </div>

    <script>
        function calculate() {
            const weight = parseFloat(document.getElementById('weight').value);
            const height = parseFloat(document.getElementById('height').value);
            const result = fullBMICalculator(weight, height);
            document.getElementById('result').innerHTML = 
                `BMI: ${result.bmi} (${result.category})`;
        }
    </script>
</body>
</html>

使用时需要注意:

js实现Bmi计算

  • 体重单位应为千克(kg)
  • 身高单位应为米(m)
  • 对于英制单位需要先进行转换
  • BMI计算公式为:体重(kg)除以身高(m)的平方

BMI分类标准:

  • 低于18.5:偏瘦
  • 18.5-24.9:正常
  • 25-29.9:超重
  • 30及以上:肥胖

标签: jsBmi
分享给朋友:

相关文章

js实现图片轮播

js实现图片轮播

实现基础图片轮播 使用HTML、CSS和JavaScript创建一个简单的图片轮播。HTML部分定义轮播容器和图片,CSS设置样式和动画效果,JavaScript处理轮播逻辑。 <div cl…

js实现换肤

js实现换肤

使用CSS变量实现换肤 通过CSS变量可以轻松实现主题切换功能。CSS变量在根元素中定义,通过JavaScript动态修改这些变量值。 :root { --primary-color: #349…

js实现tab选项卡切换

js实现tab选项卡切换

实现Tab选项卡切换的JavaScript方法 使用纯JavaScript实现Tab切换功能,可以通过监听点击事件动态切换内容显示状态。以下是两种常见实现方式: 基础DOM操作实现 /…

jquery js

jquery js

jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。它兼容多种浏览器,提供易于使用的 API,使开发者能够更高…

js实现授权

js实现授权

授权流程设计 授权流程通常涉及前端与后端的交互,常见方案包括OAuth2.0、JWT等。以JWT为例的典型流程: 用户提交凭证(如用户名密码)到认证服务 服务端验证通过后生成包含用户信息的JWT令牌…

js实现目录

js实现目录

实现目录的基本思路 在JavaScript中实现目录功能通常涉及以下几个核心步骤:解析文档中的标题元素(如h1-h6),动态生成目录结构,并添加交互逻辑(如点击跳转)。以下是具体实现方法: 解析标题…