navigator.getBattery() 并非所有现代浏览器都支持：Chrome 38+、Edge 79+、Firefox 109+ 支持，Safari 全系不支持；必须先检测 'getBattery' in navigator 再调用，返回 Promise 且仅在 HTTPS 安全上下文中可用，移动端基本不可用。
Browser support 与 navigator.getBattery() 是否可用
现代浏览器中，navigator.getBattery() 是获取设备电量状态的唯一标准接口，但它不被所有浏览器支持。Chrome 38+、Edge 79+、Firefox 109+ 支持；Safari 全系不支持（包括 iOS 和 macOS），且没有计划支持的公开信号。
调用前必须先检测是否存在：
if ('getBattery' in navigator) {
navigator.getBattery().then(battery => {
console.log(battery.level); // 0–1 之间的数值
});
} else {
console.warn('Battery Status API not supported');
}
- 不要假设
navigator.battery存在——它已被废弃，仅旧版 Chrome 使用过 - 即使支持，
navigator.getBattery()返回的是 Promise，不能同步读取 - 部分 Android WebView 或 PWA 环境下可能因权限策略返回拒绝（如未启用「后台运行」或未通过 HTTPS）
监听电量变化：onchargingchange / onlevelchange / onchargingtimechange
电量信息是动态的，需通过事件监听更新状态，而不是只取一次值。三个核心事件对应不同状态变更：
-
onchargingchange：充电状态切换（插拔电源） -
onlevelchange：电量百分比变化 ≥ 1%（注意：不是每次 0.1% 都触发） -
onchargingtimechange：预估充满/耗尽时间变化（受负载影响大，精度低）
推荐写法（避免重复绑定）：
立即学习“前端免费学习笔记（深入）”；
navigator.getBattery().then(battery => {
const update = () => {
console.log({
level: battery.level,
charging: battery.charging,
chargingTime: battery.chargingTime, // 秒数，Infinity 表示未知或已满
dischargingTime: battery.dischargingTime
});
};
battery.addEventListener('levelchange', update);
battery.addEventListener('chargingchange', update);
battery.addEventListener('chargingtimechange', update);
update(); // 立即触发一次
});
level 值不准？注意离散化和系统上报延迟
battery.level 是只读属性，范围为 0–1，但实际值往往被系统离散化处理。例如某些 Android 设备只上报 100% → 90% → 80%… 的整十数值，中间变化不会触发 levelchange。
- 不要用
battery.level === 0.5做精确判断，改用范围比较：battery.level < 0.2 -
battery.chargingTime和battery.dischargingTime在多数设备上初始为Infinity，需等待几秒才可能变为具体数值 - 部分笔记本在合盖休眠后，
battery.level可能长时间不更新，直到用户唤醒设备
HTTPS 与安全上下文限制
navigator.getBattery() 只能在安全上下文中使用——即页面必须通过 HTTPS（localhost 也允许），HTTP 页面会静默失败，Promise 永远 pending 或直接 reject。
- 开发时若用
file://协议打开 HTML，API 必然不可用 - 某些企业内网环境即使用了 HTTPS，但证书不受信任，也会导致 API 不可用
- Service Worker 中无法访问该 API（不在 window 上下文）
真正能稳定用起来的场景其实很窄：HTTPS + 主流 Chromium/Firefox 桌面端 + 用户已授权（无显式弹窗，但依赖底层系统权限）。移动端基本可视为不可用。
