<h1>JavaScript 进度条</h1>

​

<div id="myProgress">

  <div id="myBar"></div>

</div>

​

<br>

<button onclick="move()">点我</button>

function move() {

  var elem = document.getElementById("myBar");   

  var width = 1;

  var id = setInterval(frame, 10);

  function frame() {

    if (width >= 100) {

      clearInterval(id);

    } else {

      width++; 

      elem.style.width = width + '%'; 

    }

  }

}

#myProgress {

  width: 100%;

  background-color: #ddd;

}

​

#myBar {

  width: 1%;

  height: 30px;

  background-color: #4CAF50;

}