Skip to content
Related Articles

Related Articles

HTML | DOM Meter optimum Property

Improve Article
Save Article
  • Difficulty Level : Basic
  • Last Updated : 23 Aug, 2022
Improve Article
Save Article

The DOM Meter optimum Property in HTML DOM is used to set or return the value of the optimum attribute in a gauge. The optimum attribute in HTML 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 attribute, it gives an indication 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>
      DOM Meter optimum Property
      </title>
</head>
<body>
    <h1>GeeksforGeeks</h1>
    <h2>
      DOM Meter optimum Property:
      </h2>
    <!-- assigning id to meter with
        properties. -->
    <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="Geeks()">
        Submit
    </button>
    <p id="sudo"
       style="font-size:25px;
              color:green;">
      </p>
    <script>
        function Geeks() {
 
            // Return meter optimum property
            var g =
                document.getElementById(
                  "GFG").optimum;
           
            document.getElementById(
              "sudo").innerHTML = g;
        }
    </script>
</body>
</html>

Output: 
Before Clicking On Button: 

After Clicking On Button: 

Example-2: This Example sets the optimum Property

HTML




<!DOCTYPE html>
<html>
<head>
    <title>
      DOM Meter optimum Property
      </title>
</head>
<body>
    <h1>
      GeeksforGeeks
      </h1>
    <h2>
      DOM Meter optimum Property:
      </h2>
    <!-- assigning id to meter with
        properties. -->
    <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="Geeks()">
        Submit
    </button>
    <p id="sudo"
       style="font-size:25px;
              color:green;">
      </p>
    <script>
        function Geeks() {
 
            // set meter optimum property
            var g =
                document.getElementById(
                  "GFG").optimum = "0.8";
           
            document.getElementById(
              "sudo").innerHTML =
              "The value of the optimum attribute"+
              " was changed to " + g;
        }
    </script>
</body>
</html>

Output: 
Before Clicking On Button: 

After Clicking On Button: 

Supported Browsers: 

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

My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!