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

参考地址: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;	
		}
};


你可能感兴趣的:(IE/FireFox/Chrome 取style.backgroundColor 兼容性问题)