JS实现颜色值格式转换 rgb和十六进制的转换

 

RGB转换为16进制

String.prototype.colorHex = function () { // RGB颜色值的正则 var reg = /^(rgb|RGB)/; var color = this; if (reg.test(color)) { var strHex = "#"; // 把RGB的3个数值变成数组 var colorArr = color.replace(/(?:\(|\)|rgb|RGB)*/g, "").split(","); // 转成16进制 for (var i = 0; i < colorArr.length; i++) { var hex = Number(colorArr[i]).toString(16); if (hex === "0") { hex += hex; } strHex += hex; } return strHex; } else { return String(color); } };

使用方式 "rgb(255,255,255)".colorHex(); // #ffffff

16进制转换为RGB

String.prototype.colorRgb = function () { // 16进制颜色值的正则 var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/; // 把颜色值变成小写 var color = this.toLowerCase(); if (reg.test(color)) { // 如果只有三位的值，需变成六位，如：#fff => #ffffff if (color.length === 4) { var colorNew = "#"; for (var i = 1; i < 4; i += 1) { colorNew += color.slice(i, i + 1).concat(color.slice(i, i + 1)); } color = colorNew; } // 处理六位的颜色值，转为RGB var colorChange = []; for (var i = 1; i < 7; i += 2) { colorChange.push(parseInt("0x" + color.slice(i, i + 2))); } return "RGB(" + colorChange.join(",") + ")"; } else { return color; } };

使用方式

"#fff".colorRgb(); // rgb(255,255,255) "#ffffff".colorRgb(); // rgb(255,255,255)