HTML | DOM Input Color form Property

HTML DOM Input Color list Property

Last Updated : 29 Aug, 2022

The input color list property in HTML DOM is used to return a reference to the datalist element that contains an input color field.

Syntax:

colorObject.list.id

Return Value: It returns a string value that represents the value of the id attribute of the datalist element.

Example: Below HTML code is used to return the input color list property.

HTML

<!DOCTYPE html>
<html>

<head>
    <title>HTML DOM Input Color list Property</title>
</head>

<body style="text-align:center;">
    <h1 style="color:green">
        GeeksforGeeks
    </h1>
    <h2>HTML DOM Input Color list Property</h2>

    

<p>
        Select your favorite color:
        <input type="color" value="#009900" 
            id="color" list="color_list">
    </p>



    <datalist id="color_list">
        <option value="red" />
        <option value="green" />
        <option value="blue" />
        <option value="Brown" />
        <option value="yellow" />
    </datalist><br><br>

    <button onclick="btnclick()">
        Click Here!
    </button>

    <p id="paraID" style="font-size:20px;color:green;"></p>




    <!-- script to return list of  the input color  field-->
    <script>
        function btnclick() {
            var x = document.getElementById("color").list.id;
            document.getElementById("paraID").innerHTML = x;
        }
    </script>
</body>

</html>

Output:

Supported Browsers:

Google Chrome 20
Edge 14
Firefox 29
Opera 12
Safari 12.1

HTML | DOM Input Color form Property

M

manaschhabra2

Improve

Article Tags :

Similar Reads

HTML DOM Input Color name Property

The DOM Input Color name Property in HTML DOM is used to set or return the value of the name attribute. The name attribute is required for each input color field. If the name attribute is not specified in an input field then the data of that field would not be sent at all. Syntax: It returns the Inp

HTML DOM Input Color type Property

The DOM Input Color type Property in HTML DOM is used for returning which type of form element containing the color picker is. This property will always return "color". Syntax: colorObject.type Return Value: It returns a string value that represents the type of form element the input color field is.

HTML | DOM Input Color form Property

The DOM Input Color form Property in HTML DOM is used to return the reference to the form containing the input color picker field. It is read-only Property that returns a form object on success. Syntax: colorObject.form Return Values: It returns a string value which specify the reference of the form

HTML | DOM Input Color value Property

The DOM Input Color value Property in HTML DOM is used to set or return the value of the value attribute of a color picker. The value attribute is used to specify the color for the color picker. It's default value is #000000 (black color). Syntax It returns the value property.colorObject.valueIt is

HTML DOM Input Range list Property

The input Range list property in HTML DOM is used to return a reference to the datalist element that contains an input range field. Syntax: rangeObject.list.id Return Value: It returns a string value that represents the value of the id attribute of the datalist element. Example: Below HTML code is u

HTML | DOM Input Color disabled Property

The DOM Input Color disabled Property in HTML DOM is used to set or return whether a color picker should be disabled or not. A Disabled element is usually is unusable and un-clickable and are usually grey in color by default in all the Browser. This Property is used to reflect the HTML disabled attr