我制作了一个背景颜色设置为 rgb(0,0,0) 的 div;我想用javascript点击改变它的颜色。我做了一个函数来做到这一点。
function change(){
var x = 1;
var y = x + 100;
document.getElementById("box").style.backgroundColor = "rgb(" + y + "," + y + "," + y + ")"; }
它工作正常,但我只能更改一次 div 的颜色。我想要做的是获取 div 的颜色值并将其设置为 x 并再次运行该函数。所以每次点击时背景都会变成黑色->灰色->白色。取决于 y 变量。
我可以获取 div 的值,但它会在“rgb(0,0,0);”中获取它格式。我不知道得到这个之后该怎么办。我如何操作 rgb(0,0,0); 中的整数? ?
最佳答案
您可以将当前的x
值存储在data
属性中:
function change(box) {
var x = +box.getAttribute('data-x'), // +box.dataset.x for modern browsers
y = x + 100;
box.style.backgroundColor = "rgb(" + y + "," + y + "," + y + ")";
box.setAttribute('data-x', y);
}
HTML
<div id="box" onclick="change(this)"></div>
关于JavaScript 改变 BG 颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16374473/