colorpicker颜色对照

Question

rgb(255, 255, 0)跟#FFFF00都是表示同一种颜色，这两种表示之间怎么转换的？

Answer 1

先转化为数组，再转化为想要的格式，提供如下代码供参考，最近刚修改的，新增了对透明度的支持var toArray = function(value) {&nbsp; &nbsp; if (/^#[A-Za-z0-9]{3}$/.test(value)) {&nbsp; &nbsp; &nbsp; &nbsp; value = value.replace(/#/, "");&nbsp; &nbsp; &nbsp; &nbsp; var arr = [];&nbsp; &nbsp; &nbsp; &nbsp; arr[0] = parseInt(value.substr(0, 1) + value.substr(0, 1), 16);&nbsp; &nbsp; &nbsp; &nbsp; arr[1] = parseInt(value.substr(1, 1) + value.substr(1, 1), 16);&nbsp; &nbsp; &nbsp; &nbsp; arr[2] = parseInt(value.substr(2, 1) + value.substr(2, 1), 16);&nbsp; &nbsp; &nbsp; &nbsp; arr[3] = 1;&nbsp; &nbsp; &nbsp; &nbsp; return arr;&nbsp; &nbsp; }&nbsp; &nbsp; if (/^#[A-Za-z0-9]{6}$/.test(value)) {&nbsp; &nbsp; &nbsp; &nbsp; value = value.replace(/#/, "");&nbsp; &nbsp; &nbsp; &nbsp; var arr = [];&nbsp; &nbsp; &nbsp; &nbsp; arr[0] = parseInt(value.substr(0, 2), 16);&nbsp; &nbsp; &nbsp; &nbsp; arr[1] = parseInt(value.substr(2, 2), 16);&nbsp; &nbsp; &nbsp; &nbsp; arr[2] = parseInt(value.substr(4, 2), 16);&nbsp; &nbsp; &nbsp; &nbsp; arr[3] = parseInt(1);&nbsp; &nbsp; &nbsp; &nbsp; return arr;&nbsp; &nbsp; }&nbsp; &nbsp; if (/^#[A-Za-z0-9]{8}$/.test(value)) {&nbsp; &nbsp; &nbsp; &nbsp; value = value.replace(/#/, "");&nbsp; &nbsp; &nbsp; &nbsp; var arr = [];&nbsp; &nbsp; &nbsp; &nbsp; arr[0] = parseInt(value.substr(2, 2), 16);&nbsp; &nbsp; &nbsp; &nbsp; arr[1] = parseInt(value.substr(4, 2), 16);&nbsp; &nbsp; &nbsp; &nbsp; arr[2] = parseInt(value.substr(6, 2), 16);&nbsp; &nbsp; &nbsp; &nbsp; arr[3] = parseInt(value.substr(0, 2), 16) / 255;&nbsp; &nbsp; &nbsp; &nbsp; return arr;&nbsp; &nbsp; }&nbsp; &nbsp; if (/^rgb\([0-9,\.\s]+\)$/.test(value)) {&nbsp; &nbsp; &nbsp; &nbsp; var arr = value.replace(/(rgb\(|\))/gi, "").split(/,\s*/);&nbsp; &nbsp; &nbsp; &nbsp; arr[0] = parseInt(arr[0]);&nbsp; &nbsp; &nbsp; &nbsp; arr[1] = parseInt(arr[1]);&nbsp; &nbsp; &nbsp; &nbsp; arr[2] = parseInt(arr[2]);&nbsp; &nbsp; &nbsp; &nbsp; arr[3] = 1;&nbsp; &nbsp; &nbsp; &nbsp; return arr;&nbsp; &nbsp; }&nbsp; &nbsp; if (/^rgba\([0-9,\.\s]+\)$/.test(value)) {&nbsp; &nbsp; &nbsp; &nbsp; var arr = value.replace(/(rgb\(|\))/gi, "").split(/,\s*/);&nbsp; &nbsp; &nbsp; &nbsp; arr[0] = parseInt(arr[0]);&nbsp; &nbsp; &nbsp; &nbsp; arr[1] = parseInt(arr[1]);&nbsp; &nbsp; &nbsp; &nbsp; arr[2] = parseInt(arr[2]);&nbsp; &nbsp; &nbsp; &nbsp; arr[3] = parseInt(arr[3]);&nbsp; &nbsp; &nbsp; &nbsp; return arr;&nbsp; &nbsp; }&nbsp; &nbsp; return null;},toHex = function(num) {&nbsp; &nbsp; var hex;&nbsp; &nbsp; num = (num >= 0 && num <= 255) ? num: 0;&nbsp; &nbsp; hex = num.toString(16);&nbsp; &nbsp; return hex.length === 2 ? hex: '0' + hex;},toValue = {&nbsp; &nbsp; rgb: function(arr) {&nbsp; &nbsp; &nbsp; &nbsp; return 'rgb(' + arr[0] + ',' + arr[1] + ',' + arr[2] + ')';&nbsp; &nbsp; },&nbsp; &nbsp; rgba: function(arr) {&nbsp; &nbsp; &nbsp; &nbsp; return 'rgb(' + arr[0] + ',' + arr[1] + ',' + arr[2] + ',' + arr[3] + ')';&nbsp; &nbsp; },&nbsp; &nbsp; hex6: function(arr) {&nbsp; &nbsp; &nbsp; &nbsp; return '#' + toHex(arr[0]) + toHex(arr[1]) + toHex(arr[2]);&nbsp; &nbsp; },&nbsp; &nbsp; hex8: function(arr) {&nbsp; &nbsp; &nbsp; &nbsp; return '#' + toHex(arr[0]) + toHex(arr[1]) + toHex(arr[2]) + toHex(arr[3] * 255);&nbsp; &nbsp; }};正则写得不严谨，也不简洁，只能以后再折腾了。