本文章是以prototype原型的方式,给string字符串类型添加方法,用于实现颜色值格式的转换。
如果你不用原型方法,那么你只要借鉴实现方法就好了。
RGB转换为16进制
- String.prototype.colorHex = function () {
- // RGB颜色值的正则
- var reg = /^(rgb|RGB)/;
- var color = this;
- if (reg.test(color)) {
- var strHex = "#";
- // 把RGB的3个数值变成数组
- var colorArr = color.replace(/(?:\(|\)|rgb|RGB)*/g, "").split(",");
- // 转成16进制
- for (var i = 0; i < colorArr.length; i++) {
- var hex = Number(colorArr[i]).toString(16);
- if (hex === "0") {
- hex += hex;
- }
- strHex += hex;
- }
- return strHex;
- } else {
- return String(color);
- }
- };
使用方法:
"rgb(255,255,255)".colorHex(); // #ffffff
16进制转换为RGB
- String.prototype.colorRgb = function () {
- // 16进制颜色值的正则
- var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
- // 把颜色值变成小写
- var color = this.toLowerCase();
- if (reg.test(color)) {
- // 如果只有三位的值,需变成六位,如:#fff => #ffffff
- if (color.length === 4) {
- var colorNew = "#";
- for (var i = 1; i < 4; i += 1) {
- colorNew += color.slice(i, i + 1).concat(color.slice(i, i + 1));
- }
- color = colorNew;
- }
- // 处理六位的颜色值,转为RGB
- var colorChange = [];
- for (var i = 1; i < 7; i += 2) {
- colorChange.push(parseInt("0x" + color.slice(i, i + 2)));
- }
- return "RGB(" + colorChange.join(",") + ")";
- } else {
- return color;
- }
- };
使用方法:
- "#fff".colorRgb(); // rgb(255,255,255)
- "#ffffff".colorRgb(); // rgb(255,255,255)
联系客服