HTML progress
progress元素可用于指示任务的逐渐完成。它有两个局部属性: value,max,form
。
value属性定义当前进度,它在零和max属性的值之间。
当省略max属性时,比例在0和1之间。使用浮点数表示进度,例如30%的0.3。
例子
下面的代码显示了progress元素和一些按钮。按下按钮可更新progress元素显示的值。
<!DOCTYPE HTML> <html> <body> <progress id="myprogress" value="10" max="100"></progress> <p> <button type="button" value="30">30%</button> <button type="button" value="60">60%</button> <button type="button" value="90">90%</button> </p> <script> var buttons = document.getElementsByTagName("BUTTON"); var progress = document.getElementById("myprogress"); for (var i = 0; i < buttons.length; i++) { buttons[i].onclick = function(e) { progress.value = e.target.value; }; } </script> </body> </html>点击查看实例