javascript - 动态改变背景颜色

Question

如果我有一个元素，我正在监听对文档的点击(可以在任何地方，这部分无关紧要)，并且每次点击，我都希望元素的颜色变深，我怎么才能从逻辑上或数字上改变它？

这是我尝试过的:

    on('click', function() {

        var myElementBG = myElement.backgroundColor;

        myElement.style.backgroundColor = myElementBG - 101010;
    });

这里的问题是 myElementBG 返回“#707070”，因此尝试从中减去 101010 会产生 NaN 错误，因为“#”是值的一部分。

有什么想法吗？

Answer 1

试试这个:

JsFiddle

function subtractColorsHex(a, b) {
    a = a.replace('#', '');
    // We don't expect '#' symbol in b
    var decA = parseInt(a, 16);
    var decB = parseInt(b, 16);
    var resultDec = decA - decB;
    var resultHex = Math.abs(resultDec).toString(16);

    return "#" + "000000".substring(0, 6 - resultHex.length) + resultHex;
}

用法:

subtractColorsHex('#070707', '101010');