Javascript Reference - HTML DOM Progress value Property
The value attribute in progress element
specifies how many percent the task has completed.
The value property sets or gets the value of the value attribute of a progress bar.
Browser Support
 |
 |
 |
 |
 |
|
|---|---|---|---|---|---|
value |
Yes | 10.0 | Yes | Yes | Yes |
Syntax
Return the value property.
var v = progressObject.value
Set the value property.
progressObject.value=number
Property Values
| Value | Description |
|---|---|
| number | Set how many percent the task has completed |
Return Value
A floating point number representing the current progress of the task.
Example
The following code shows how to get the current value of a progress bar.
<!DOCTYPE html>
<html>
<body>
<progress id="myProgress" value="25" max="100"></progress>
<button onclick="myFunction()">test</button>
<p id="demo"></p>
<script>
function myFunction() {<!--from www . j a v a 2 s . c o m-->
var x = document.getElementById("myProgress").value;
document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>
The code above is rendered as follows:
Example 2
The following code shows how to change the current value in a progress bar.
<!DOCTYPE html>
<html>
<body>
<progress id="myProgress" value="25" max="100"></progress>
<button onclick="myFunction()">test</button>
<script>
function myFunction() {<!--from w w w .j a va 2 s . co m-->
document.getElementById("myProgress").value = "75";
}
</script>
</body>
</html>
The code above is rendered as follows: