JS实现Collatz conjecture（考拉兹猜想）点击按钮返回0问题求助

存在的问题 #

• 输入值读取逻辑错误：页面初始化阶段就读取了输入框的值，此时用户尚未输入内容，拿到的是空值；且未将输入框返回的字符串类型转为数字类型，直接运算会出现异常。
• 计数变量未初始化：coups仅做了声明没有赋值初始值0，后续自增运算会得到NaN无效值。
• DOM属性拼写错误：最终输出计数时将innerHTML错写为innerHtml，该小写属性不存在，无法正常渲染内容。
• 缺少每次点击的重置逻辑：多次点击按钮时，不会清空上一次的输出结果，也不会重置计算数值和计数变量，会导致逻辑混乱。

修复后代码 #

let input   = document.getElementById('nombre');
let btn     = document.getElementById('submit');
let output  = document.getElementById('output');

function conjecture() {
    // 每次点击重新读取输入值，转为数字
    let nombre = Number(input.value);
    // 初始化计数
    let coups = 0;
    // 清空上次输出
    output.innerHTML = '';
    // 输入合法性判断，避免非数字输入导致异常
    if(isNaN(nombre) || nombre < 1) {
        output.innerHTML = '请输入大于等于1的正整数';
        return;
    }

    do {
        if (nombre%2 === 0) {
            nombre /= 2;
            output.innerHTML += nombre + '<br>';
            coups ++;
        } else {
            nombre *= 3;
            nombre ++;
            output.innerHTML += nombre + '<br>';
            coups++;   
        }
    } while (nombre>1);

    output.innerHTML += `总共用了${coups}步到达1<br>`; 
}

btn.addEventListener('click', conjecture);

内容的提问来源于stack exchange，提问作者Ganoss_