JavaScript多if语句失效问题排查：狗年龄计算工具异常求助

云上老周

2026-8-19

问题排查与修复：狗年龄计算工具的条件逻辑错误

问题根源

你的代码中两个if语句无法同时正常工作，核心原因是DOM内容被后续代码覆盖：

函数执行时先默认设置了常规结果文本到result元素
第一个if（年份<1900）设置提示后，第二个if（年龄超过14岁）会继续执行并覆盖innerHTML，导致第一个条件的提示被冲掉
例如输入1800时，既满足年份<1900，又满足remain<=0，第二个if会直接覆盖第一个的提示内容

修复后的代码

JavaScript部分

function calc() {
    // 获取输入并转换为数字
    const inputYear = Number(document.getElementById("year").value);
    const resultElement = document.getElementById("result");
    
    // 先做合法性校验，不合法直接提示并终止函数
    if (isNaN(inputYear) || inputYear < 1900) {
        resultElement.innerHTML = "Please enter a valid year.";
        return;
    }

    const currentYear = new Date().getFullYear();
    const dogAge = currentYear - inputYear;
    const humanAge = dogAge * 7;
    const remainingYears = 15 - dogAge;
    
    // 根据年龄生成对应消息
    let message;
    if (remainingYears <= 0) {
        message = `Your dog is ${dogAge} years old. Your dog's human age is ${humanAge}. Your dog completed its life span.`;
    } else {
        message = `Your dog is ${dogAge} years old. Your dog's human age is ${humanAge}. Your dog has ${remainingYears} years to complete its life span.`;
    }
    
    resultElement.innerHTML = message;
}