IE/FireFox/Chrome 取style.backgroundColor 兼容性问题

来源：互联网发布：mac里什么浏览器最流畅编辑：程序博客网时间：2024/04/30 05:51

参考地址：http://www.zhangxinxu.com/wordpress/2010/03/javascript-%E5%8D%81%E5%85%AD%E8%BF%9B%E5%88%B6%E4%B8%8Ergb%E9%A2%9C%E8%89%B2%E5%80%BC%E7%9A%84%E7%9B%B8%E4%BA%92%E8%BD%AC%E6%8D%A2/

最近在做产品的跨浏览器支持，也不用第三方框架如jquery之类的。开发过程中遇到一个取背景色不兼容的问题。

在IE浏览器中，使用style.backgroundColor 返回的值是用16进制表示的，比如红色那么返回： #FF0000，

但是在FF 和 Chrome下面返回的值却是RGB类型的，红色返回如下： rgb(255,0,0).

现在需要统一返回结果，参考上面的地址，使用了作者提供的把 RGB 转成16进制的方法，问题解决。

String.prototype.colorHex = function(){var that = this;var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;if(/^(rgb|RGB)/.test(that)){var aColor = that.replace(/(?:\(|\)|rgb|RGB)*/g,"").split(",");var strHex = "#";for(var i=0; i<aColor.length; i++){var hex = Number(aColor[i]).toString(16);if(hex === "0"){hex += hex;}strHex += hex;}if(strHex.length !== 7){strHex = that;}return strHex;}else if(reg.test(that)){var aNum = that.replace(/#/,"").split("");if(aNum.length === 6){return that;}else if(aNum.length === 3){var numHex = "#";for(var i=0; i<aNum.length; i+=1){numHex += (aNum[i]+aNum[i]);}return numHex;}}else{return that;}};