JavaScript随机生成颜色以及十六进制颜色 与RGB颜色值的相互转换

JavaScript随机生成颜色以及十六进制颜色

与RGB颜色值的相互转换

1.随机生成的十六进制颜色

/**
 * 随机生成颜色
 * @return 随机生成的十六进制颜色
*/

function randomColor(){
  var colorStr=Math.floor(Math.random()*0xFFFFFF).toString(16).toUpperCase();
  return"#"+"000000".substring(0,6-colorStr)+colorStr;
}

2.十六进制颜色转换为RGB颜色

/**
 * 十六进制颜色转换为RGB颜色
 * @param color 要转换的十六进制颜色
 * @return RGB颜色
*/
function colorHexToRGB(color){
  color=color.toUpperCase();
  var regexpHex=/^#[0-9a-fA-F]{3,6}$/;//Hex
  if(regexpHex.test(color)){
    var hexArray=new Array();
    var count=1;
    for(var i=1;i<=3;i++){
      if(color.length-2*i>3-i){
        hexArray.push(Number("0x"+color.substring(count,count+2)));
        count+=2;
      }else{
        hexArray.push(Number("0x"+color.charAt(count)+color.charAt(count)));
        count+=1;
      }
    }
    return"RGB("+hexArray.join(",")+")";
  }else{
    return color;
  }
}

3.RGB颜色转换为十六进制颜色

/**
 * RGB颜色转换为十六进制颜色
 * @param color 要转换的RGB颜色
 * @return 十六进制颜色
*/

function colorRGBToHex(color){
  var regexpRGB=/^(rgb|RGB)([0-9]{1,3},s?[0-9]{1,3},s?[0-9]{1,3})$/;//RGB
  if(regexpRGB.test(color)){
    color=color.replace(/((|)|rgb|RGB)*/g,"").split(",");
    var colorHex="#";
    for(var i=0;i<color.length;i++){
      var hex=Number(color[i]).toString(16);
      if(hex.length==1) hex="0"+hex;
      colorHex+=hex;
    }
    return colorHex;
  }else{
    return color;
  }
}

转载地址:http://www.thinksaas.cn/group/topic/268437/



  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 在 JavaScript 中,可以使用 Math.random() 方法来生成一个随机的十六进制颜色。例如:'#'+Math.floor(Math.random()*16777215).toString(16); ### 回答2: 在JavaScript中,可以通过以下代码生成随机十六进制颜色: ``` function getRandomHexColor() { let letters = '0123456789ABCDEF'; let color = '#'; for (let i = 0; i < 6; i++) { color += letters[Math.floor(Math.random() * 16)]; } return color; } // 调用生成随机颜色函数 let randomColor = getRandomHexColor(); console.log(randomColor); ``` 首先,定义了一个名为`getRandomHexColor`的函数。函数中定义了一个变量`letters`,用于存储十六进制的字符集合。接着,通过`color`变量初始化为'#',表示颜色十六进制格式。然后,通过for循环生成6位的随机十六进制数,每次循环将随机获取`letters`中的一个字符追加到`color`中。最后,返回生成的随机颜色。 在实际使用时,可以通过调用`getRandomHexColor`函数获取随机颜色,并将随机颜色赋给需要的元素或属性。 ### 回答3: 在JavaScript中生成随机十六进制颜色可以使用以下代码: ```javascript function generateRandomColor() { // 生成随机的RGB颜色 var r = Math.floor(Math.random() * 256); var g = Math.floor(Math.random() * 256); var b = Math.floor(Math.random() * 256); // 将RGB颜色转换十六进制字符串 var hexR = r.toString(16); var hexG = g.toString(16); var hexB = b.toString(16); // 如果转换后的十六进制字符串只有一位,则在前面补0 if (hexR.length === 1) { hexR = "0" + hexR; } if (hexG.length === 1) { hexG = "0" + hexG; } if (hexB.length === 1) { hexB = "0" + hexB; } // 返回随机生成十六进制颜色 return "#" + hexR + hexG + hexB; } // 调用函数生成随机颜色并打印输出 var randomColor = generateRandomColor(); console.log(randomColor); ``` 此代码首先使用 `Math.random()` 方法生成0到1之间的随机数,然后乘以255得到RGB颜色的随机数。接下来,将这些数转换十六进制的字符串,如果字符串的长度只有一位,则在字符串前面添加0。最后,将转换后的十六进制颜色拼接成完整的颜色字符串,并返回。通过调用 `generateRandomColor()` 函数即可生成随机的十六进制颜色
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值