Home > Developer > Web Develop
<! DOCTYPE html>
>
>
<meta CharSet="UTF-8">
<title></title>
<style type= "Text/css">
. Stage{
width: px;
Height: + px;
margin: px auto;
}
#box{
margin-top: px;
width: px;
height:px;
background: red;
}
</style>
>
<body>
<div class= "Stage">
<span> Click the box to change the color amount!! </span>
<div id="box" onclick="ChangeColor()"></Div >
</div>
</body>
<script type= "Text/javascript">
var box=1;
function ChangeColor() {
var a=document.getElementById ("box");
switch (box) {
Case 1: A.style.backgroundcolor="yellow"; box+ +; break;
Case 2: A.style.backgroundcolor="cyan"; box+ +; break;
Case 3: A.style.backgroundcolor="tomato"; box+ +; break;
Case 4: A.style.backgroundcolor="purple"; box+ +; break;
Case 5: A.style.backgroundcolor="cornflowerblue"; box+ +; break;
Case 6: A.style.backgroundcolor="DarkSalmon"; box+ +; break;
Case 7: A.style.backgroundcolor="red"; box=1; break;
}
}
</script>
>
Use JS to write a simple program, switch the colorful box background
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
