寻求navigator.getBattery()替代方案：实现跨浏览器低电量提醒

由于navigator.getBattery()因隐私安全原因已被废弃，且Firefox、Safari等浏览器不支持，目前没有完全通用的Web API可以直接获取设备电池状态，但可以通过以下方式实现类似需求：

1. 通用降级方案（兼容所有浏览器） #

直接通过UI提示用户手动检查电量，这是兼容性最高的方式，适用于所有场景：

// 为不支持Battery API的浏览器添加通用提示
const batteryWarning = document.createElement('div');
batteryWarning.style.cssText = `
    padding: 12px;
    background-color: #fff3cd;
    border: 1px solid #ffeeba;
    color: #856404;
    text-align: center;
`;
batteryWarning.textContent = '请检查您的设备电量，低于30%请及时充电';
document.body.prepend(batteryWarning);

2. 保留Chromium系浏览器支持（做优雅降级） #

部分Chromium内核浏览器（Chrome、Edge等）仍支持navigator.getBattery()，可以保留原有逻辑同时添加降级处理，针对不支持的浏览器显示通用提示：

function showChargeAlert() {
    let goCharge = document.createElement('h1');
    goCharge.style.cssText = `
        font-size: 40px;
        color: #FF0101;
        text-align: center;
        margin-top: 50px;
    `;
    goCharge.textContent = 'GO CHARGE YOUR DEVICE NOW!';
    document.body.appendChild(goCharge);
    document.title = 'GO CHARGE YOUR DEVICE NOW!';
    
    const icoElement = document.getElementById('ico');
    if (icoElement) icoElement.href = 'battery_alert.png';
    
    alert('GO CHARGE YOUR DEVICE NOW!');
}

// 检查API支持性
if ('getBattery' in navigator) {
    navigator.getBattery().then(battery => {
        const checkStatus = () => {
            if (battery.level < 0.3 && !battery.charging) {
                showChargeAlert();
            }
        };
        
        // 初始检查
        checkStatus();
        // 监听电量和充电状态变化
        battery.addEventListener('levelchange', checkStatus);
        battery.addEventListener('chargingchange', checkStatus);
    });
} else {
    // 不支持时显示通用提示
    const warning = document.createElement('div');
    warning.style.cssText = `
        padding: 12px;
        background-color: #fff3cd;
        border: 1px solid #ffeeba;
        color: #856404;
        text-align: center;
    `;
    warning.textContent = '请检查您的设备电量，低于30%请及时充电';
    document.body.prepend(warning);
}

3. PWA进阶方案（依赖用户授权） #

如果你的应用是PWA，可以结合后台同步和推送通知功能，引导用户开启低电量提醒权限（部分移动系统支持系统级低电量推送），但这需要用户主动授权，且无法直接获取电池数据，只能依赖系统触发。

核心限制说明 #

• 出于隐私保护，现代浏览器已禁止网页直接获取设备电池的精确数据，这是行业标准，因此不存在完美的替代方案。
• 所有依赖系统电池数据的方案都存在兼容性缺口，无法覆盖所有浏览器和设备。

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