如何获取RGB值的十六进制颜色值

给定RGB颜色值，任务是使用JavaScript获取该颜色的十六进制代码。

方法1：

• 调用convert()自定义函数，并使用RGB值作为参数。
• 使用 match()方法 选择红色、绿色和蓝色的值。RGB的值以数组形式存储。
• 调用hexCode()函数将RGB的值转换为十六进制代码。
• slice()方法 获取字符串的片段，并将提取的部分返回为新的字符串。 toString()方法 将数字转换为字符串。

示例1： 此示例获取白色的RGB值，即rgb(255,255,255)，并使用JavaScript将其转换为十六进制代码。

<h1 style="color:green;"> 
    GeeksforGeeks 
</h1> 
  
<p id="GFG_UP"> 
</p> 
  
<button onClick="GFG_Fun()"> 
    click here 
</button> 
  
<p id="GFG_DOWN"> 
</p> 
  
<script> 
    var up = document.getElementById('GFG_UP'); 
    var down = document.getElementById('GFG_DOWN'); 
    up.innerHTML = 'Click on button to hex code of the color'; 
      
    function convert(rgb) { 
        rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/); 
      
        function hexCode(i) { 
            return ("0" + parseInt(i).toString(16)).slice(-2); 
        } 
        return "#" + hexCode(rgb[1]) + hexCode(rgb[2]) 
                + hexCode(rgb[3]); 
    } 
      
    function GFG_Fun() { 
        down.innerHTML = "Hex Code of 'white' = " 
            + convert('rgb(255,255,255)'); 
    } 
</script>

输出：

示例2： 这个方法首先检查是否提供了十六进制值而不是RGB值。因为一些浏览器会返回十六进制值而不是RGB值。这个示例获取绿色的RGB值为RGB(0,128,0)，然后通过创建一个函数将其转换为HexCode。

<h1 style="color:green;"> 
    GeeksforGeeks 
</h1> 
  
<p id="GFG_UP"> 
</p> 
  
<button onClick="GFG_Fun()"> 
    click here 
</button> 
  
<p id="GFG_DOWN"></p> 
  
<script> 
    var up = document.getElementById('GFG_UP'); 
    var down = document.getElementById('GFG_DOWN'); 
    up.innerHTML = 'Click on button to hex code of the color'; 
      
    function convert(rgb) { 
        if (/^#[0-9A-F]{6}/i.test(rgb)) return rgb; 
      
        rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)/); 
      
        function hexCode(i) { 
            return ("0" + parseInt(i).toString(16)).slice(-2); 
        } 
        return "#" + hexCode(rgb[1]) + hexCode(rgb[2]) 
                + hexCode(rgb[3]); 
    } 
      
    function GFG_Fun() { 
        down.innerHTML = "Hex Code of 'Green' = " 
                + convert('rgb(0,128,0)'); 
    } 
</script>

输出：