3.3.6 progress控件
优质
小牛编辑
123浏览
2023-12-01
progress控件用来定义一个进度条,用来表示页面中某个任务完成的进度。
progress控件可以是确定的进度,则当前进度是介于某个最小值与最大值之间的值。这种情况下,进度条处于一个静止状态。
<progress min="0" max="100" value="35"></progress>
则表示进度值介于0到100之间,当前进度是35。则进度条静止在35的地方,如图 3‑28 所示:
progress控件也可以是不确定的进度,仅表示任务正在进行中,而不知道什么时候结束。这种情况下,浏览器默认会显示一个活动的进度条,仅表示任务正在进行中。当然,也可以通过Javascript来更新进度,实现真正的进度条。
progress控件具有可读写value、max两个属性:
- value属性表示任务已完成的进度值,可通过DOM元素progress.value进行操作;
- max属性表示任务所需的总进度值,可通过DOM元素progress.max进行操作;
对于一个确定性的任务,只要能知道已完成进度值及总进度值,就可以通过Javascript实现真实的动态进度条(Javascript超出我们的讨论范围,这里就不提供Javascript代码了)。