首页 > 试题广场 >

请编写一个JavaScript 函数toRGB，它的作用是转

[问答题]
请编写一个JavaScript 函数toRGB，它的作用是转换CSS中常用的颜色编码。 要求： 
alert(toRGB("#0000FF"));          // 输出 rgb(0, 0, 255)
alert(toRGB("invalid"));          // 输出 invalid	
alert(toRGB("#G00"));              // 输出 #G00
添加回答
推荐
oxyflour头像 oxyflour 
function toRGB(color) {
    var regex = /^#([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/
    match = color.match(regex)
    return match ? 'rgb('+parseInt(match[1], 16)+','+parseInt(match[2], 16)+','+parseInt(match[3], 16)+')' : color
}

编辑于 2015-01-13 20:05:34 回复(1)
路人1头像 路人1 

	//如果没有太多要求 一行代码足矣。





	function toRGB(color){





	  return /^#[a-f0-9]{6}$/i.test(color)?"rgb("+color.slice(1).replace(/([a-f0-9]){2}/gi,function($1){





	    return parseInt($1,16)+","





	  }).slice(0,-1)+")":color; 





	}





	/*





	判断颜色是否符合#000000~#ffffff





	【符合】    拼接字符串





	  拼接过程：首先取color第二位进行正则替换。





	       将每两位字符转换为一个十进制数字和一个逗号，再去除末位逗号





	【不符合】  返回原字符





	*/
编辑于 2017-03-31 14:46:37 回复(0)
Mr.Apple头像 Mr.Apple
function toRGB(color) {
var len=color.length;
var regex = /^#([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/;//正则表达式()
if(len==7){
var match = color.match(regex);// #ff00aa,ff,00,aa
return match ? 'rgb('+parseInt(match[1], 16)+','+parseInt(match[2], 16)+','+parseInt(match[3], 16)+')' : 'invalid'
}else if(len==4){
return color;
}else{
return 'invalid';
}
}
function toRGB(color) {
    var regex1 = /^#([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/;
    var regex2 = /^#([0-9a-fA-F])([0-9a-fA-F])([0-9a-fA-F])$/;
    var match = color.match(regex1) || color.match(regex2);
    return match ? 'rgb(' + parseInt(match[1], 16) + ',' + parseInt(match[2], 16) + ',' + parseInt(match[3], 16) + ')' : 'invalid';
}
编辑于 2016-08-05 20:33:48 回复(0)
mzvast头像 mzvast 
var toRGB = function (str) {
  if(!str.startsWith('#')||str.length!==7){
    return str;
  }
  var r = str.slice(1, 3);
  var g = str.slice(3, 5);
  var b = str.slice(5, 7);
  return "rgb("+parseInt('0x'+r)+","+parseInt('0x'+g)+","+parseInt('0x'+b)+")";
}

发表于 2016-07-29 16:23:32 回复(0)
洋溢的蓝莓头像 洋溢的蓝莓 
function toRGB(color) {
    if (/^#[0-9a-f]{3}$/i.test(color)) {
        return color
    }
    else if (/^#[0-9a-f]{6}$/i.test(color)) {
        color = color.slice(1); // 去掉 #
        var str = [];
        color.replace(/\w{2}/gi, function ($1) { // g 全局
           str.push(parseInt($1, 16))
        });
        return 'rgb(' + str.join(",") + ')'
    }
    else {
        return 'invalid'
    }
}
编辑于 2017-09-08 09:29:47 回复(0)
lnxiaoy头像 lnxiaoy
function toRGB(color) {
        var re = /^\#\w{3,6}/;
        var match = {'A':10, 'a':10,'B':11,'b':11,'C':12,'c':12,'D':13,'d':13,'E':14,'e':14,'F':15,'f':15};
        if(re.test(color)&&color.length === 4) return color.substr(1,4);
        if(re.test(color)&&color.length === 7){
        var result = [];
        var index=0;
        for (var i = 1; i < color.length; i= i+2,index++) {
        var tmp = (color[i] in match == true) ? 16*match[color[i]] : 16*parseInt(color[i]);
        var temp = (color[i] in match == true) ? match[color[i+1]] : parseInt(color[i+1]);
        result[index] = tmp+temp;

        }
        return 'rgb('+result.join(',')+')';
        }
        return 'invalid';
    }
发表于 2016-08-05 16:34:40 回复(0)
ThreeRR头像 ThreeRR

var color = '#abcdef';
function toRGB(color) {
    var re = /^#([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/;
    match = color.match(re);
    if(match) {
        var r = parseInt(match[1],16);
        var g = parseInt(match[2],16);
        var b = parseInt(match[3],16);
        console.log('rgb('+ r +','+ g + ',' + b +')');
    }else {
        console.log(color);
    }

}
toRGB(color);
发表于 2016-07-20 16:09:42 回复(0)
byenow头像 byenow
function toRGB(str) {
    var arr = str.split('');
    switch (arr[0]) {
        case '#':
            if (arr.length !== 7) {
                return str;
            }
            var newArr = []
            for (var i = 1; i < arr.length+3; i += 2) {
                newArr.push(parseInt(([arr[i],arr[i+1]]).join(''),16));
            }
            return 'rgb'+'('+newArr[0]+','+newArr[1]+','+newArr[2]+')'
            break;
        default:
            return str;
    }
}
发表于 2016-03-12 17:25:23 回复(0)
洁头像 洁
<pre class="prettyprint lang-js">function toRGB(str){ var reg=/^#[0-9a-f]*$/i; var ans=reg.test(str); if(ans){//如果为真 var str1=str.substring(1,3); var str2=str.substring(3,5); var str3=str.substring(5,7); var a=parseInt(str1,16); var b=parseInt(str2,16); var c=parseInt(str3,16); return "rgb("+a+","+","+b+","+c+")"; }else { return str; } }</pre> <br />
发表于 2015-08-17 21:29:58 回复(0)
lauren头像 lauren 
function toRGB(str){
    if(str.substring(0,1)=="#"){
        return "invalid";
    }else if(str.length==4||str.length==7){
        if(str.length==4){str=str+str.slice(1);}
        var n=str.slice(1);
        var arr=new Array();
        arr[0]=parseInt(n.slice(0,2),16);
        arr[1]=parseInt(n.slice(2,4),16);
        arr[2]=parseInt(n.slice(4,6),16);  
        var result="("+arr.join()+")";
        return result;
    }else{
        return "invalid";
    }
}

发表于 2015-08-15 11:05:06 回复(0)
LancerComet头像 LancerComet
function toRGB(color){
if(color.indexOf("#")>-1 && color.length === 7){
                // Case: #XXXXXX
var rgbColor = {
r:color.substr(1,2),
g:color.substr(3,4),
b:color.substr(5,6)
}
for(var i in rgbColor){
rgbColor[i] = parseInt(rgbColor[i],16);
}
return "rgb("+ rgbColor.r + "," + rgbColor.g + "," + rgbColor.b + ")";
}else if(color.indexOf("#")>-1 && color.length < 7){
                // Case: #XXX
return color;
}else{
               // Else
return color;
}
}
发表于 2015-07-08 18:52:18 回复(0)
jser头像 jser 
         var toRGB = function(str) {

                var matches,
                    result,
                    len,
                    redColorValue,
                    greenColorValue,
                    blueColorValue;
                
                //异常处理
                if ((matches = str.match(/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})\s*$/)) === null) {
                    return result = "invalid";
                }

                if ((len = matches[1].length) === 3) {
                
                    return result = matches[0];

                }else{
                    
                    redColorValue = parseInt(matches[1].charAt(0) + matches[1].charAt(1),16);
                    greenColorValue = parseInt(matches[1].charAt(2) + matches[1].charAt(3),16);
                    blueColorValue = parseInt(matches[1].charAt(4) + matches[1].charAt(5),16);

                    return result = "rgb(" + redColorValue +"," + greenColorValue + "," + blueColorValue + ")";
                }

          };

发表于 2015-06-14 09:19:01 回复(0)
towry头像 towry 
function torgb(color) {
    if (typeof color != 'string') {
        return 'invalid';
    }
    var regex = /^\s*#(?:([0-9a-fA-F]{3})|([0-9a-fA-F]{6}))\s*$/
    var match = color.match(regex);
    if (!match) {
        return "invalid";
    }
    var hex = typeof match[1] == 'undefined' ? match[2] : match[1];
    if (!hex) {
        return 'invalid';
    }
    var r = /.{2}/g;
    if (hex.length == 3) {
        r = /.{1}/g;
    }
    hex = hex.match(r);
    var o = [];
    for (var i = 0; i < hex.length; i++) {
        o.push(parseInt(hex.length == 3 ? hex[i] + hex[i] : hex[i], 16));
    }
    var os = o.join(', ');
    os = 'rgb(' + os + ')';
    return os;
}

// 3 is not satisfied
发表于 2015-05-05 16:33:33 回复(0)
冬琳头像 冬琳 
 var parseColor = function( val ){ 
     var r, g, b; 
    // 参数为RGB模式时不做进制转换，直接截取字符串即可 
     if( /rgb/.test(val) ){ 
         var arr = val.match( /\d+/g ); 
         r = parseInt( arr[0] ); 
         g = parseInt( arr[1] ); 
         b = parseInt( arr[2] ); 
     } 
     // 参数为十六进制时需要做进制转换 
     else if( /#/.test(val) ){ 
         var len = val.length; 
         // 非简写模式 #0066cc 
         if( len === 7 ){ 
             r = parseInt( val.slice(1, 3), 16 ); 
             g = parseInt( val.slice(3, 5), 16 ); 
             b = parseInt( val.slice(5), 16 ); 
         } else if(len==4){
            return val;
         }
     } 
     else{ 
         return val; 
     } 
   
     return "rgb("+r+","+g+","+b+")";
  };

发表于 2015-03-31 15:03:12 回复(0)
牛客154700号头像 牛客154700号
var reg = /#[0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F]{6}/g
function toRGB(str){
        if(!reg.test(str)){//首先检测要转换的字符串是否符合颜色格式的书写要求
            return str;
        }else{
            var str0 = str.substring(1);//将字符串最前面的#去掉
            var str1 = str0.slice(0,2);//将str0的前两个字符取下
            var str2 = str0.slice(2,4);//将字符串中间两个字符取下
            var str3 = str0.slice(4,6);//将字符串最后两个字符取下
            return ("rgb("+parseInt("0x"+str1,16)+", "+parseInt("0x"+str2,16)+", "+parseInt("0x"+str3,16)+")");
        }
    }

发表于 2015-03-30 16:33:54 回复(0)
Leooonard头像 Leooonard
            function toRGB(rgb){
                var regx= /^#((\d|[a-f]){2})((\d|[a-f]){2})((\d|[a-f]){2})$/;
                if(!regx.test(rgb)){
                    return rgb;
                }else{
                    var result= regx.exec(rgb);
                    var r= result[1];
                    var g= result[2];
                    var b= result[3];
                    r= parseInt("0x"+ r);
                    g= parseInt("0x"+ g);
                    b= parseInt("0x"+ b);
                    return "rgb("+ r+ ", "+ g+ ", "+ b+ ")";
                }
            };
            alert(toRGB("asd"));
发表于 2015-03-28 23:13:33 回复(0)
牛客224199号头像 牛客224199号
function toRGB(color){
    return color;
} 
alert(toRGB("#0000FF"));  alert(toRGB("invalid")); alert(toRGB("#G00"));

发表于 2014-12-22 21:14:01 回复(0)
lenrinfvck头像 lenrinfvck
var toRGB = function(rgb){
     var r,g,b;
     if(rgb.indexOf('#')&&rgb.length==7){
         r = parseInt(rgb.slice(1,3),'16');
         g = parseInt(rgb.slice(3,5),'16');
         b = parseInt(rgb.slice(5),'16');
         rgb = 'rgb('+r+','+g+','+b+')' ;    
    }
    return rgb
}
发表于 2014-12-16 21:41:04 回复(0)
刘大脸猫头像 刘大脸猫

function toRGB(color){

    var hh = “”;

    var kk = [];

    var reg =/^#[0-9a-zA-Z]{3})$/; // 设置正则规则

    if(color==”invalid”) return “invalid”;// 如果无效返回

    if(reg.test(color)) return color; // 如果是三为数表示，直接返回。

    else {

        for(var i=0; i

        hh = color.substr(i,2);//substr() 从第 i 位开始截取 2 位字符

        var cc = parseInt(hh,16);

           kk.push(cc);

}

Return(“RGB(“+kk+”)”);

}

}

alert(toRGB("#0000FF"));          // 输出 rgb(0, 0, 255)

alert(toRGB("invalid"));          // 输出 invalid

alert(toRGB("#G00"));              // 输出 #G00

发表于 2014-12-15 18:21:45 回复(0)
牛客501870号头像 牛客501870号
function toRGB(str){
    var s=str;
    if(s.substr(0,1)=="#"&s.length==7){
        var toDecimal=function (str,index){
            return new Number("0x"+str.substr(index,2)).toString();
        }
        var rgb=[];
        for(var i=0;i<3;i++){
            rgb.push(toDecimal(s,i*2+1));
        }
        return "rgb("+rgb.join(",")+")";
    }else{
        return s;
    }
}
发表于 2014-12-08 12:17:00 回复(0)
FORONE头像 FORONE
function  toRGB（argument）{
    if(argument==/^#[0~9][a`f][A`F]/&&argument.length==7){
         var argu=splite(argument);
         var a=argu[1]+argu[2]
    }     
}
发表于 2014-11-29 11:35:17 回复(0)
提交观点

问题信息

前端工程师 阿里巴巴 Javascript 2011
来自：阿里巴巴2011前端工...
上传者：额头上有疤
难度：
25条回答 10268浏览

热门推荐

相关试题

扫一扫，把题目装进口袋

求职之前，先上牛客

扫描二维码，进入QQ群

扫描二维码，关注牛客公众号