HTML DOM Meter optimum Property

The Meter optimum Property in HTML DOM is used to set or return the value of the optimum attribute in a gauge. The optimum attribute indicates the optimal numeric value for the gauge. It must be within the range i.e. between min and max. When it is used with the low and high attributes, it indicates where along the range is considered preferable.

Syntax: 

  • It returns the optimum property.
meterObject.optimum
  • It is used to set the optimum property.
meterObject.optimum = number

Property Values: It contains a numeric value which specifies the floating point number that is the optimum value of the gauge.

Return Values: It returns a numeric value which represents the floating point number that is the optimum value of the gauge. 

Example 1: This example returns a optimum property.

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM Meter optimum Property
    </title>
</head>
 
<body style="text-align: center;">
     
    <h1>w3wiki</h1>
 
    <h2>HTML DOM Meter optimum Property</h2>
 
    <meter value="0.6" max="0.9" min="0.1"
        id="GFG" optimum="0.6" high="0.5" low="0.2">
    </meter>
    <br><br>
 
    <button onClick="myBeginner()">
        Click Here!
    </button>
 
    <p id="result"></p>
 
    <script>
        function myBeginner() {
            let optimumVal = document
                .getElementById("GFG").optimum;
 
            document.getElementById("result")
                .innerHTML = optimumVal;
        }
    </script>
</body>
 
</html>


Output:

Example 2: This example sets the optimum property. 

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM Meter optimum Property
    </title>
</head>
 
<body style="text-align: center;">
 
    <h1>w3wiki</h1>
 
    <h2>HTML DOM Meter optimum Property</h2>
 
    <meter value="0.6" max="0.9" min="0.1"
        id="GFG" optimum="0.6" high="0.5" low="0.2">
    </meter>
    <br><br>
     
    <button onclick="myBeginner()">
        Click Here!
    </button>
 
    <p id="result"></p>
 
    <script>
        function myBeginner() {
            let optimumVal = document
                .getElementById("GFG").optimum = "0.8";
 
            document.getElementById("result").innerHTML =
                "Value of optimum Attribute Changed to "
                + optimumVal;
        }
    </script>
</body>
 
</html>


Output:

Supported Browsers:

  • Chrome 6
  • Firefox 16
  • Edge 18
  • Safari 6
  • Opera 11