从 RGB 值中提取十六进制颜色代码
使用 jQuery 获取元素背景的 RGB 值可能并不总是足够。您可能需要将这些值转换为其对应的十六进制值。此代码片段演示了如何提取 RGB 值:
$('#selector').css('backgroundColor');
我们的目标是获取 RGB 值对应的十六进制值。
解决方案
TL;DR 解决方案提供了一个简洁的单行函数,可以同时处理 RGB 和 RGBA格式:
const rgba2hex = (rgba) => `#${rgba.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+\.{0,1}\d*))?\)$/).slice(1).map((n, i) => (i === 3 ? Math.round(parseFloat(n) * 255) : parseFloat(n)).toString(16).padStart(2, '0').replace('NaN', '')).join('')}`
更新的解决方案(2021)
现代浏览器现在支持 ECMAScript 5 和 2015 功能,允许更优雅的解决方案:
const rgb2hex = (rgb) => `#${rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/).slice(1).map(n => parseInt(n, 10).toString(16).padStart(2, '0')).join('')}`
此更新的函数简化了从 RGB 到十六进制颜色的转换代码。
以上是如何在 JavaScript 中将 RGB 颜色代码转换为十六进制颜色代码?的详细内容。更多信息请关注PHP中文网其他相关文章!