<!DOCTYPE html>
<html>
<body>
<span></span>
<progress max="100" value="0" ></progress>
<div id="value"></div>
<script>
let progress = document.querySelector("progress");
let span = document.querySelector("span");
let textList = { 10: "准备开始", 20: "开始启动", 50: "正在扫描", 70: "扫描完毕", 100: "关闭设备" };
requestAnimationFrame(function age() {
if (progress.value < 100) {
progress.value += 1;
}
document.querySelector("#value").innerHTML = progress.value;
if (textList[progress.value]) {
span.innerHTML = textList[progress.value];
}
requestAnimationFrame(age);
})
</script>
</body>
</html>
直接放到HTML页面就可以用了