简单的做一个颜色进制转换

以蓝色为例,#0000FF应该被表示成rgb(0,0,255)。

我们将函数命名为getRGB()

(可以将字符串视为数组,这个数组的元素为字符)

function getRGB(color) {
  var rgb = [parseInt('0x'+color.slice(1,3)),parseInt('0x'+color.slice(3,5)),parseInt('0x'+color.slice(5,7))];
  return "rgb(" + rgb[0] + ","  + rgb[1] + "," +rgb[2] +")" ;       
}

在控制台中,我们发现:当我们缩写16进制颜色的时候,就会出现NaN;

(这个例子我练习了之前学到的数组的slice方法)

我们可以试试这样

        var getRGB = function(oRgb) {
            var color = [],
                rgb   = [];
            oRgb = oRgb.replace(/#/, "");
            if (oRgb.length == 3) {
                var tmp = [];
                for (var i = 0; i < 3; i++) {
                    tmp.push(oRgb.charAt(i) + oRgb.charAt(i));
                }
                oRgb = tmp.join("");
            }
            for (var i = 0; i < 3; i++) {
                color[i] = "0x" + oRgb.substr(i + 2, 2);
                rgb.push(parseInt(Number(color[i])));
            }
            return "rgb(" +  rgb.join(",") + ")";
        }

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏GreenLeaves

JS框架设计之对象类型判断一种子模块

Javascript有两套数据类型,一套是基础数据类型,一套是对象数据类型。基础数据类型包括5种基本数据类型,分别是null,bool,undefined,nu...

1838
来自专栏快乐八哥

JavaScript内置对象--Math对象

在JavaScript开发中,除了简单加减乘除运算之外,有时候开发,特别是动画或者游戏开发中,需要使用复杂的数学运算。JavaScript中Math对象提供了一...

2235
来自专栏陈满iOS

iOS基础·属性的修饰词与setter的关系

可以自己手动为实例变量在头文件 中声明setter、getter方法,并在实现文件中实现setter、getter方法。你也可以不声明不实现,但不要再企图调用s...

852
来自专栏cmazxiaoma的架构师之路

你应该会的一道多线程笔试题

2133
来自专栏对角另一面

lodash源码分析之NaN不是NaN

本文为读 lodash 源码的第五篇,后续文章会更新到这个仓库中,欢迎 star:pocket-lodash

2075
来自专栏代码世界

前端之JavaScript内容

一、JavaScript概述 1、JavaScript的历史 1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言(最初绑定在CEn...

3507
来自专栏对角另一面

lodash源码分析之NaN不是NaN

暗恋之纯粹,在于不求结果,完全把自己锁闭在一个单向的关系里面。 ——梁文道《暗恋到偷窥》 本文为读 lodash 源码的第五篇,后续文章会更新到这个仓库中,...

3286
来自专栏石奈子的Java之路

原 荐 你真的了解For循环吗?一道For循

1633
来自专栏IMWeb前端团队

看Zepto如何实现增删改查DOM

本文作者:IMWeb 谦龙 原文出处:IMWeb社区 未经同意,禁止转载 前言 dom也就是文档对象模型,是针对HTML和XML的一个api,描绘了...

2649
来自专栏Java与Android技术栈

Java8 Stream的总结

Stream是Java 8新增的接口,Stream可以认为是一个高级版本的 Iterator。它代表着数据流,流中的数据元素的数量可以是有限的,也可以是无限的。

802

扫码关注云+社区