您的位置:首页 >PHP教程 > 基础篇 > javascript > js的rgb颜色转化成十六进制方法>

js的rgb颜色转化成十六进制方法

前两天工作之中遇到了个小问题,后台希望将色值传递的时候以十六位的形式传递,但是因为不同浏览器之间的差异性,导致传递的色值有时是rgb形式的,因此在参考了网上的代码之后改了一个方法用以转换。

首先是转换的思路,rgb是以三原色进行表述的,将其中的三个数字分别转换为两位16进制的数字后相拼接,之后在前面加上#便成为了16位的表述方法。

如何提取三原色中的三个数字,方法不止一种,我采用的是以match进行全局查找,通过正则获取连续的数字。

而10进制与16进制的转换则是利用了数组查询的方式,先将10进制的数字与16相除,将商与余数分别进行数组查询,然后进行拼接。

如下图:

function RGBToHex(rgb){ 

   var regexp = /[0-9]{0,3}/g;  
   var re = rgb.match(regexp);//利用正则表达式去掉多余的部分,将rgb中的数字提取
   var hexColor = "#"; var hex = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'];  
   for (var i = 0; i < re.length; i++) {
        var r = null, c = re[i], l = c; 
        var hexAr = [];
        while (c > 16){  
              r = c % 16;  
              c = (c / 16) >> 0; 
              hexAr.push(hex[r]);  
         } hexAr.push(hex[c]);
         if(l < 16&&l != ""){        
             hexAr.push(0)
         }
       hexColor += hexAr.reverse().join(''); 
    }  
   return hexColor;  

代码并不复杂,希望能够给新手一点帮助,大家共同学习成长~

0

本文固定链接: http://www.ctphp.com/article/detail/aid-68.html| js的rgb颜色转化成十六进制方法-PHP教程-基础篇-javascript--长藤个人博客网站

该日志由 admin 于2014年11月12日发表在您的位置:首页 >PHP教程 > 基础篇 > javascript > 分类下, 通告目前不可用,你可以至底部留下评论。
原创文章转载请注明: js的rgb颜色转化成十六进制方法-PHP教程-基础篇-javascript--长藤个人博客网站

发表我的评论

Hi,您需要填写昵称和邮箱!

  • 必填项