类型错误： 无法读取/设置属性'style' null

Question

我试图使用javascript显示电池电量，但发现了一个意外错误。我的代码：

const  percentage = document.getElementById('percentage');
const percent = document.getElementById('percent');
navigator.getBattery().then(function(battery){
percentage.style.width = battery.level * 100 + '%' ;
percent.innerHTML = battery.level * 100  + '%';
alert(battery.level);
});

我得到一个错误，说，>TypeError:无法读取null的正确"style"当我试着把第4行和第5行放在评论上时例如

// 
percentage.style.width = battery.level * 100 + '%' ;

首先，我收到另一条错误消息，上面写着：

TypeError:无法将属性'innerHTML'设置为null然后，alert((给出了正确的电池电量

Answer 1

我找到了它的解决方案。我没有使用变量，而是在.style之前编写了整个语句，这很有效。最终代码：

setInterval(function(){ navigator.getBattery().then(function(battery){
document.getElementById('percentage').style.width = battery.level * 100 + '%' ;
document.getElementById('percent').innerHTML = battery.level * 100  + '%';
});
}, 10);