html中input type="number"的value始终是字符串，如"42"而非42；浏览器仅做格式校验和界面优化，不自动类型转换，javascript需用number()、parsefloat()等显式转换才能用于计算。
HTML 表单标签本身不提供“类型自动转换”能力——input 的 type 属性只影响渲染行为和基础验证，不会把用户输入的字符串自动转成数字、日期对象或布尔值。所谓“自动转换”，实际是浏览器在提交时按 enctype 和 method 编码规则组织数据，而 JavaScript 读取时仍需手动解析。
为什么 type="number" 输入的仍是字符串？
即使你写 <input type="number" name="age">，用 form.elements.age.value 拿到的依然是字符串（如 "25"），不是 25。浏览器不做隐式类型转换，只做格式校验和键盘限制：
-
type="number"禁止输入字母，但允许空值、负号、小数点——这些都可能让.value成为无效数字字符串 -
type="date"返回 ISO 格式字符串（如"2026-06-17"），不是Date对象 -
type="checkbox"的.value永远是字符串（默认"on"），勾选状态需靠.checked判断
哪些属性能触发有限的“语义化编码”？
真正影响数据形态的是 form 的 enctype 和 method，它们决定提交时如何序列化字段：
-
method="get"+ 默认enctype="application/x-www-form-urlencoded"：所有字段都变成 URL 查询参数，name=value形式，全部是字符串 -
method="post"+enctype="multipart/form-data"：文件字段单独编码，文本字段仍为字符串键值对 -
enctype="text/plain"（极少用）：字段间用换行分隔，值不编码，但依然全是字符串
没有哪个属性能让浏览器在提交前把 "42" 自动变成整数 42 或把 "true" 变成布尔值。
想拿到数字/日期/布尔值？必须自己解析
JavaScript 是唯一可控的转换入口，且必须显式处理：
- 数字：
Number(input.value) || 0（注意""→0，"abc"→NaN） - 日期：
new Date(input.value)（input.type === "date"时才安全，否则可能返回Invalid Date） - 布尔：
input.type === "checkbox" ? input.checked : (input.value === "true") - 避免直接用
parseInt或parseFloat，它们对空字符串或非数字开头会返回NaN或意外截断（如"12px"→12）
容易被忽略的兼容性陷阱
不同浏览器对 type 的实现差异会影响你“以为”的转换逻辑：
- 移动端 Safari 对
type="number"支持弱，可能弹出全键盘而非数字键盘，用户仍可粘贴字母 -
type="range"的.value是字符串，但.valueAsNumber才是数字——这个属性在旧版 Edge 中不可用 -
type="email"或type="url"不校验格式合法性，只触发:valid伪类；input.checkValidity()才真正跑 pattern 验证 - 表单 reset 后，
input.value恢复初始字符串值，input.valueAsNumber却可能为0（已知 Chrome 行为）
别依赖任何 input 属性自动给你类型安全的数据——从 DOM 读出来的永远是字符串，转换逻辑必须亲手写、亲手测、亲手兜底。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
