HTML DOM Input Color Object - संपूर्ण गाइड

HTML DOM Input Color Object

HTML DOM Input Color Object HTML दस्तावेज़ में type="color" वाले इनपुट एलिमेंट को दर्शाता है। यह रंग पिकर बनाने, एक्सेस करने और उसके सभी attributes को प्रबंधित करने का इंटरफेस प्रदान करता है।

Color Object बनाना

var colorObject = document.createElement("input");
colorObject.type = "color";

Color Object के Attributes

उदाहरण

रंग पिकर का name attribute बदलना:

<!DOCTYPE html>
<html>
<head>
<title>Input Color Name</title>
</head>
<body>
<form id="formForColorsInput">
  रंग पिकर: <input type="color" id="Color" name="primaryColor">
</form>
<button onclick="changeNameValue()">नाम मान बदलें</button>
<div id="divDisplay"></div>
<script>
  var inputColor = document.getElementById("Color");
  var divDisplay = document.getElementById("divDisplay");
  divDisplay.textContent = 'रंग इनपुट का नाम: ' + inputColor.name;
  function changeNameValue() {
    if (inputColor.name == 'primaryColor') {
      inputColor.name = 'secondaryColor';
      divDisplay.textContent = 'रंग इनपुट का नाम: ' + inputColor.name;
    }
  }
</script>
</body>
</html>

आउटपुट

प्रारंभ में रंग इनपुट का नाम "primaryColor" दिखाता है। "नाम मान बदलें" बटन क्लिक करने पर यह "secondaryColor" में बदल जाता है।

मुख्य बिंदु

• Color Object सभी रंग पिकर-संबंधी properties और methods तक पहुंच प्रदान करता है
• document.createElement("input") और type="color" से नया रंग पिकर बना सकते हैं
• value property हेक्साडेसिमल रंग कोड (#RRGGBB) लौटाता है
• defaultValue पेज लोड पर प्रारंभिक रंग मान दर्शाता है
• रंग पिकर UI ब्राउज़र और OS पर निर्भर करता है (नेटिव रंग पिकर डायलॉग)