html rgb转换16进制js,JS实现十六进制颜色值（HEX）和RGB格式转换

这篇文章主要介绍了javascript实现十六进制颜色值(HEX)和RGB格式之间的转换，使用正则的方法实现RGB颜色转换为16进制，需要的朋友可以参考下。

在日常开发中，经常会用到不同格式的颜色域值之间的相互转换，以下给出一种解决方法。

//十六进制颜色值的正则表达式

var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;

/*RGB颜色转换为16进制*/

String.prototype.colorHex = function(){

var that = this;

if(/^(rgb|RGB)/.test(that)){

var aColor = that.replace(/(?:\(|\)|rgb|RGB)*/g,"").split(",");

var strHex = "#";

for(var i=0; i

var hex = Number(aColor).toString(16);

if(hex === "0"){

hex += hex;

}

strHex += hex;

}

if(strHex.length !== 7){

strHex = that;

}

return strHex;

}else if(reg.test(that)){

var aNum = that.replace(/#/,"").split("");

if(aNum.length === 6){

return that;

}else if(aNum.length === 3){

var numHex = "#";

for(var i=0; i

numHex += (aNum+aNum);

}

return numHex;

}

}else{

return that;

}};

/*16进制颜色转为RGB格式*/

String.prototype.colorRgb = function(){

var sColor = this.toLowerCase();

if(sColor && reg.test(sColor)){

if(sColor.length === 4){

var sColorNew = "#";

for(var i=1; i<4; i+=1){

sColorNew += sColor.slice(i,i+1).concat(sColor.slice(i,i+1));

}

sColor = sColorNew;

}

//处理六位的颜色值

var sColorChange = [];

for(var i=1; i<7; i+=2){

sColorChange.push(parseInt("0x"+sColor.slice(i,i+2)));

}

return "RGB(" + sColorChange.join(",") + ")";

}else{

return sColor;

}};

使用颜色转换方法：

ar sRgb = "RGB(23, 245, 56)" , sHex = "#34538b";

var sHexColor = sRgb.colorHex();

var sRgbColor = sHex.colorRgb();