在实现简易计算器时，若对 html 输入框元素直接使用一元加号（+）强制转换类型，却未取其 value 属性，会导致 nan；正确做法是先获取 input 元素的 value 字符串，再转换为数字。
在实现简易计算器时，若对 html 输入框元素直接使用一元加号（+）强制转换类型，却未取其 value 属性，会导致 nan；正确做法是先获取 input 元素的 value 字符串，再转换为数字。
你遇到的 NaN（Not-a-Number）问题，根源在于混淆了 DOM 元素对象 与 用户输入的值。在原始代码中：
const op1 = +document.getElementById("op1"); // ❌ 错误：+ 作用于整个 HTMLInputElement 对象此时 document.getElementById("op1") 返回的是一个 <input> 元素对象（如 [object HTMLInputElement]），对其使用 + 操作符会尝试调用该对象的 toString() 方法——结果通常是 "[object HTMLInputElement]"，而 +"[object HTMLInputElement]" 无法解析为有效数字，最终返回 NaN。
✅ 正确写法必须显式访问 .value 属性，获取用户输入的字符串值，再进行类型转换：
const sumar = () => {
const op1 = +document.getElementById("op1").value; // ✅ 获取值后再转数字
const op2 = +document.getElementById("op2").value;
document.getElementById("resultado").innerHTML = op1 + op2;
};⚠️ 注意事项：
立即学习“Java免费学习笔记（深入）”；
- +input.value 是简洁的数字转换方式，但对空字符串 ""、非数字字符（如 "abc"）或空白（" "）会返回 NaN；
- 更健壮的做法是结合 parseFloat() 或 Number() 并做容错处理：
const sumar = () => {
const input1 = document.getElementById("op1");
const input2 = document.getElementById("op2");
const num1 = parseFloat(input1.value) || 0; // 空值/无效值默认为 0
const num2 = parseFloat(input2.value) || 0;
document.getElementById("resultado").textContent = num1 + num2;
};? 推荐使用 textContent 替代 innerHTML 更新显示内容（除非需渲染 HTML），更安全且性能更好；同时建议为输入框添加 required 或 min/max 属性增强表单约束，并在 JS 中加入简单校验（如 isNaN(num1) || isNaN(num2)）提升用户体验。
总结：永远记得 —— DOM 元素 ≠ 其值；要运算数字，必须通过 .value 取值，再转换类型。
