capture属性仅对type="file"有效，需配合accept使用才能触发摄像头；iOS支持有限且行为不稳定，Android各厂商浏览器兼容性差异大；它不可通过JS动态设置，必须在HTML中声明。
capture 属性只对 type="file" 有效
直接给 type="text" 或 type="button" 加 capture 不会触发摄像头——它本质上是 <input type="file"> 的扩展属性，必须配合 accept 才能生效。浏览器看到 capture，只是告诉系统“优先调起摄像头”，最终是否弹出、调用哪个设备，仍由 accept 决定。
常见错误是写成：<input type="file" capture>，没加 accept，结果在 iOS 上完全没反应，Android 可能默认打开文件选择器而非相机。
-
accept="image/*"→ 触发后置摄像头（多数 Android）或系统默认相机（iOS） -
accept="image/*;capture=camera"→ 更明确地提示调用摄像头（部分 Android 浏览器更敏感） -
accept="video/*"→ 触发录像界面（非拍照）
iOS Safari 对 capture 的支持很有限
iOS 16.4 之前，capture 在 Safari 中基本被忽略；16.4+ 开始支持，但行为不稳定：有时仍跳转到照片库，有时才唤起相机。这不是 bug，而是苹果有意限制自动调起硬件的权限——它要求用户显式交互（比如点击）后才能触发，且不允许页面静默调用。
所以别指望 capture 在 iOS 上 100% 唤起摄像头。实测中，以下写法最可靠：
立即学习“前端免费学习笔记（深入）”；
<input type="file" accept="image/*" capture="environment" onclick="this.click()">
注意：capture="environment" 指定后置摄像头（user 是前置），但 iOS 仍可能无视该值；onclick="this.click()" 是为了绕过某些 Safari 对自动 focus/click 的拦截，确保用户真实点击后触发。
Android 各厂商浏览器行为差异大
Chrome on Android 通常响应良好，capture + accept="image/*" 能直接唤起相机；但华为、小米、OPPO 自带浏览器常把 capture 当作普通文件选择器处理，甚至直接报错 NotSupportedError。
关键判断点：
- 检查 UA 是否含
WebView—— 很多 App 内嵌 WebView 完全不支持capture - 不要依赖
capture="user"强制前置，部分机型会 fallback 到后置或失败 - 如果需要稳定调起相机，得降级方案：检测
navigator.mediaDevices.getUserMedia是否可用，可用则用<video>+canvas自建拍摄流
capture 不是 API，不能用 JavaScript 动态设置
capture 是 HTML 布尔属性，只能在标签里声明，不能通过 input.setAttribute('capture', 'environment') 或 input.capture = 'environment' 动态生效。JS 设置后 DOM 里能看到属性，但浏览器不会重新解析并触发相机。
想动态控制？唯一办法是重建 <input> 元素：
const input = document.createElement('input');<br>input.type = 'file';<br>input.accept = 'image/*';<br>input.capture = 'environment';<br>input.onchange = handlePhoto;<br>document.body.appendChild(input);<br>input.click();
但要注意：iOS 下即使这样重建，依然受点击事件上下文限制——必须由用户真实点击触发，否则会被静默拒绝。
真正容易被忽略的是：capture 只影响初始调起方式，拍完照后选中的文件仍是标准 File 对象，后续上传逻辑和普通 file input 完全一致，别额外加奇怪的 base64 转换或 blob 处理。
