如何获取元素的背景色代码?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (48)

如何获得元素的背景色代码?

HTML

<div style="background-color:#f5b405"></div>

jQuery

$(this).css("background-color");

结果

rgb(245, 180, 5)

我想要的

#f5b405
提问于
用户回答回答于

选中下面的示例链接,然后单击div以获得十六进制的颜色值。

var color = '';
$('div').click(function() {
    var x = $(this).css('backgroundColor');
    hexc(x);
    alert(color);
})

function hexc(colorval) {
    var parts = colorval.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
    delete(parts[0]);
    for (var i = 1; i <= 3; ++i) {
        parts[i] = parseInt(parts[i]).toString(16);
        if (parts[i].length == 1) parts[i] = '0' + parts[i];
    }
    color = '#' + parts.join('');
}
用户回答回答于

这有点麻烦,因为HTML 5画布需要解析颜色值,而某些属性如下strokeStylefillStyle设置如下:

var ctx = document.createElement('canvas').getContext('2d');
ctx.strokeStyle = 'rgb(64, 128, 192)';
var hexColor = ctx.strokeStyle;

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励