以下是一个示例代码,实现按下按钮时改变方块颜色的功能:
HTML代码:
Change Square Color
JavaScript代码(script.js文件):
function changeColor() {
var square = document.getElementById("square");
var currentColor = square.style.backgroundColor;
// 生成随机颜色
var randomColor = '#' + Math.floor(Math.random()*16777215).toString(16);
// 如果生成的随机颜色和当前颜色相同,则继续生成随机颜色,直到颜色不同为止
while (currentColor === randomColor) {
randomColor = '#' + Math.floor(Math.random()*16777215).toString(16);
}
square.style.backgroundColor = randomColor;
}
这个示例代码中,通过getElementById
函数获取方块元素,并利用style.backgroundColor
属性来获取和设置方块的背景颜色。当按下按钮时,会执行changeColor
函数,该函数会生成一个随机颜色,并将其设置为方块的背景颜色。为了避免生成的随机颜色和当前颜色相同,还加入了一个循环判断的逻辑。
上一篇:按下按钮时发生奇怪的崩溃
下一篇:按下按钮时更换图片