The DOM Meter value Property is used to set or return the value of the value attribute in a gauge. The value attribute is used to specify the current value of the gauge. The value should between the min and max attribute values.
Syntax:
meterObject.value
meterObject.value = number
Property Values: It contains the value i.e number which specifies a floating point number that represents the current value of the gauge.
Return Value: It returns a floating point number which represents the current value of the gauge.
Example: This Example returns a value Property.
<!DOCTYPE html> < html > < head > < title > DOM Meter Object </ title > </ head > < body > < h1 >GeeksforGeeks</ h1 > < h2 > DOM Meter value Property: </ h2 > Sachin's score: <!-- assigning id to meter with properties. --> < meter value = "5" min = "0" max = "10" > 5 out of 10 </ meter > < br >Laxma score: <!-- meter tag using value property. --> < meter id = "GFG" min = "0" low = "40" high = "65" max = "100" value = "55" > </ meter > < br > < button onclick = "Geeks()" > Submit </ button > < p id = "sudo" style="font-size:25px; color:green;"> </ p > < script > function Geeks() { // Accessing 'meter' tag. var g = document.getElementById("GFG").value; document.getElementById("sudo").innerHTML = g; } </ script > </ body > </ html > |
Output:
Before Clicking On Button:
After Clicking on Button:
Example-2: This Example sets the value Property.
<!DOCTYPE html> < html > < head > < title > DOM Meter Object </ title > </ head > < body > < h1 > GeeksforGeeks </ h1 > < h2 > DOM Meter value Property: </ h2 > Sachin's score: <!-- assigning id to meter with properties. --> < meter value = "5" min = "0" max = "10" > 5 out of 10 </ meter > < br >Laxma score: <!-- meter tag using value property. --> < meter id = "GFG" min = "0" low = "40" high = "65" max = "100" value = "55" > </ meter > < br > < button onclick = "Geeks()" > Submit </ button > < p id = "sudo" style="font-size:25px; color:green;"> </ p > < script > function Geeks() { // Accessing 'meter' tag. var g = document.getElementById("GFG").value = "45"; document.getElementById("sudo").innerHTML = "The value was changed to " + g; } </ script > </ body > </ html > |
Output :
Before Clicking On button:
After Clicking On Button:
Supported Browsers: The browser supported by DOM Meter value Property are listed below:
- Chrome
- Firefox
- Safari 6.0
- Opera