HTML | DOM Progress max Property
The DOM Progress max Property is used to set or return the value of the max attribute of an <progress> element. The max attribute represents the total work is to be done for completing a task.
Syntax:
- It is used to return the progress max property.
progressObject.max
- It is used to set the progress max property.
progressObject.max = number
Property Value:
- number: It specifies the amount of work already competed in terms of numeric value.
Return Value: It returns a floating point number which represents how much amount of work required to accomplish a task.
Example-1: This example illustrates how to set the progress max property.
HTML
<!DOCTYPE html><html><head> <title> HTML DOM Progress max Property </title></head><body> <h1 style="color:green;"> GeeksForGeeks </h1> <h2>DOM Progress max Property </h2> Downloading progress for a song: <progress id="GFG" value="30" max="100"> </progress> <br> <br> <button onclick="myGeeks()"> Submit </button> <script> function myGeeks() { var pr = document.getElementById("GFG").max = "60"; } </script></body></html> |
Output:
Before Clicking On Button :
After Clicking On Button:
Example-2 : This example illustrates how to return the progress max property.
HTML
<!DOCTYPE html><html><head> <title> HTML DOM Progress max Property </title></head><body> <h1 style="color:green;"> GeeksForGeeks </h1> <h2>DOM Progress max Property </h2> Downloading progress for a song: <progress id="GFG" value="57" max="100"> </progress> <br> <br> <button onclick="myGeeks()"> Submit </button> <p id="sudo"></p> <script> function myGeeks() { var pr = document.getElementById("GFG").max; document.getElementById("sudo").innerHTML = pr; } </script></body></html> |
Output :
Before Clicking On Button:
After Clicking On Button:
Supported Browsers: The browser supported by DOM Progress max Property are listed below:
- Google Chrome 6
- Edge 12
- Internet Explorer 10
- Firefox 6
- Opera 11
- Safari 6
Please Login to comment...