单击按钮改变文档颜色【4个按钮,分别为red,blue,yellow,green
时间: 2024-10-15 17:09:21 浏览: 34
stuDarkTheme:我为uni网站定制的深色主题
在网页或应用程序中,当设计用户界面时,你可以创建四个独立的按钮,分别代表红色(Red)、蓝色(Blue)、黄色(Yellow)和绿色(Green)。每个按钮通常关联一个事件监听器,比如JavaScript的`onclick`事件。当你单击其中一个按钮时,程序会检测到这个事件并执行相应的操作。
例如,当点击"红"按钮时,可能会通过JavaScript更改文档(页面)的文字颜色为红色;点击"蓝"按钮则变为蓝色,以此类推。这种交互式功能让用户能够直观地控制文档显示的颜色变化。
具体的代码示例(简化版)可能会像这样:
```html
<button onclick="changeColor('red')">红色</button>
<button onclick="changeColor('blue')">蓝色</button>
<button onclick="changeColor('yellow')">黄色</button>
<button onclick="changeColor('green')">绿色</button>
<script>
function changeColor(color) {
document.body.style.color = color;
}
</script>
```
在这个例子中,`changeColor`函数接受颜色名称作为参数,并将文档主体的颜色设置为选定的颜色。
阅读全文