编写一个函数,从任何CSS颜色或由类
定义的颜色返回颜色值我想知道参数传递给我的函数的字符串是否是一个颜色 - 只回答已经很好的颜色 - 然后知道它的十六进制值。
所以我已经定义了一个正则表达式,以确定该字符串是#fff
还是rgb(0,0,0)
,但它没有捕获CSS标准颜色,例如black
和{{ 1}}。我应该测试每个颜色名称还是有任何方法或预先存在的功能来做到这一点?感谢。
white
用法示例:
function getColor(classOrColor) {
if(classOrColor[0] === '.') {
var temp = $('<div id="temp" style="display:none;" class="'+ classOrColor.split('.').join(' ') + '"/>').appendTo('body');
var color = temp.css('color');
temp.remove();
return color;
} else {
return classOrColor;
}
}
使用此答案搜索是否存在具有此名称的班级:https://stackoverflow.com/questions/983586/...
然后调用相同的函数(稍作修改)
getColor('yellow')
getColor('#abc')
getColor('rgb(1,2,3)')
getColor('.myClass .myOtherClass')
用法示例:
function getColor(classOrColor) {
if(classExists(classOrColor)) {
var temp = $('<div id="temp" style="display:none;" class="'+ classOrColor + '"/>').appendTo('body');
var color = temp.css('color');
temp.remove();
return color;
} else {
return classOrColor;
}
}
答案 0 :(得分:4)
您可以使用getComputedStyle - 这不适用于IE8及以下版本。
请查看Javascript function to convert color names to hex codes的答案,以获得比我更好的报道(在我写完之后看到它)
function getRGB(str){
var elem = document.createElement("div");
elem.style.display="none";
elem.style.color=str;
document.body.appendChild(elem);
return window.getComputedStyle(elem,null).getPropertyValue("color");
}
alert(getRGB("red"));