Skip to content
Related Articles

Related Articles

HTML | DOM Input Range min Property
  • Difficulty Level : Basic
  • Last Updated : 29 Mar, 2019

The Input Range min Property in HTML DOM is used to set or return the value of min attribute of the slider control. The min attribute is used to specify the minimum value of slider control.

Syntax:

  • It returns the Input Range min Property:
    rangeObject.min
  • It is used to set Input Range min Property:
    rangeObject.min = number

Property Values: It contains single value number which specify the minimum value allowed for the slider control.

Return Values: It returns a string which represents the minimum allowed value.

Example-1:






<!DOCTYPE html>
<html>
  
<head>
    <title>
        DOM Input Range min Property
    </title>
</head>
  
<body style="text-align:center;">
  
    <h1 style="color:green;"
            GeeksForGeeks 
        </h1>
  
    <h2>
      DOM Input Range min Property
  </h2>
  
    <input type="range" 
           id="myRange" 
           min="10" 
           max="50">
  
    <br>
    <br>
  
    <button onclick="myGeeks()">
        Click Here!
    </button>
  
    <p id="GFG" 
       style="font-size:23px;
              color:green;">
  </p>
  
    <script>
        function myGeeks() {
  
            // Accessing input value 
            var x =
                document.getElementById(
                  "myRange").min;
            
            document.getElementById(
              "GFG").innerHTML = x;
        }
    </script>
  
</body>
  
</html>

Output:
Before Click on button:

After Click on button:

Example-2:




<!DOCTYPE html>
<html>
  
<head>
    <title>
        DOM Input Range min Property
    </title>
</head>
  
<body style="text-align:center;">
  
    <h1 style="color:green;"
            GeeksForGeeks 
        </h1>
  
    <h2>
      DOM Input Range min Property
  </h2>
  
    <input type="range" 
           id="myRange" 
           min="10" 
           max="50">
  
    <br>
    <br>
  
    <button onclick="myGeeks()">
        Click Here!
    </button>
  
    <p id="GFG" 
       style="font-size:23px;
              color:green;">
  </p>
  
    <script>
        function myGeeks() {
  
            // Accessing input value  
            var x =
                document.getElementById(
                  "myRange").min = "25";
  
            document.getElementById(
              "GFG").innerHTML =
                "The value of the min attribute"+
              " was changed to " + x;
        }
    </script>
  
</body>
  
</html>

Output:
Before Click on button:

After Click on button:

Supported Browsers: The browser supported by DOM Input Range min Property are listed below:

  • Google Chrome
  • Internet Explorer 10.0
  • Firefox
  • Safari
  • Opera
My Personal Notes arrow_drop_up
Recommended Articles
Page :