A5下载 - 努力做内容最丰富最安全的下载站!

A5站长下载站

当前位置:A5下载 > 编程开发 > 网站开发 > Javascript实现颜色rgb与16进制转换的方法

Javascript实现颜色rgb与16进制转换的方法

时间:2015-07-07 11:55作者:zhao人气:57

本文实例讲述了Javascript实现颜色rgb与16进制转换的方法。分享给大家供大家参考。具体如下:

使用方法:

Color(12,34,56);

Color("#fff")

Color("#defdcd")

实现代码:

//颜色转换

var Color = function() {

if (!(this instanceof Color)) {

var color = new Color();

color._init.apply(color, arguments);

return color;

}

if (arguments.length) {

this._init.apply(this, arguments);

}

}

//设置get,set方法

var methods = ["red", "green", "blue", "colorValue"];

var defineSetGetMethod = function(fn, methods) {

var fnPrototype = fn.prototype;

for (var i = 0; i < methods.length; i++) {

var methodName = methods[i].charAt(0).toLocaleUpperCase() + methods[i].substring(1);

fn.prototype['set' + methodName] = new Function("value", "this." + methods[i] + "= value;");

fn.prototype['get' + methodName] = new Function("return this." + methods[i] + ";");

fn.prototype['toString'] = new Function('return "rgb("+this.red+","+this.green+","+this.blue+")";');

}

};

defineSetGetMethod(Color, methods);

//扩展函数的实例方法

var extend = function(fn, option) {

var fnPrototype = fn.prototype;

for (var i in option) {

fnPrototype[i] = option[i];

}

};

extend(Color, {

_init : function() {

if (arguments.length == 3) {

this.red = arguments[0];

this.green = arguments[1];

this.blue = arguments[2];

this.getColorValue();

} else {

var colorValue = arguments[0].replace(/^#{1}/, "");

if (colorValue.length == 3) {

colorValue = colorValue.replace(/(.)/g, '$1$1');

}

this.red = parseInt('0x' + colorValue.substring(0, 2), 16);

this.green = parseInt('0x' + colorValue.substring(2, 4), 16);

this.blue = parseInt('0x' + colorValue.substring(4), 16);

this.colorValue = "#" + colorValue;

}

},

getColorValue : function() {

if (this.colorValue) {

return this.colorValue;

}

var hR = this.red.toString(16);

var hG = this.green.toString(16);

var hB = this.blue.toString(16);

return this.colorValue = "#" + (this.red < 16 ? ("0" + hR) : hR) + (this.green < 16 ? ("0" + hG) : hG) + (this.blue < 16 ? ("0" + hB) : hB);

}

});

希望本文所述对大家的javascript程序设计有所帮助。

标签Javascript,实现,颜色,rgb,进制,转换,方法

相关下载

查看所有评论+

网友评论

网友
您的评论需要经过审核才能显示

公众号