<html>
<head>
<metacharset="UTF-8">
<title>点击按钮使div变色</title>
<style>
div{
border:1px solid white;
width:200px;
height:200px;
background-color:#7f7f7f;
}
</style>
</head>
<body>
<divid="one"></div>
<inputtype="button"value="红"id="red">
<inputtype="button"value="橙"id="orange">
<inputtype="button"value="黄"id="yellow">
<inputtype="button"value="绿"id="green">
<inputtype="button"value="蓝"id="blue">
<inputtype="button"value="靛"id="indigo">
<inputtype="button"value="紫"id="purple">
<script>
var one =document.getElementById("one");
var red=decoment.getElementById("red");
var orange=decoment.getElementById("orange");
var yellow=decoment.getElementById("yellow");
var green=decoment.getElementById("green");
var blue=decoment.getElementById("blue");
var indigo=decoment.getElementById("indigo");
var purple=decoment.getElementById("purple");
red.οnclick=function(){
one.style="background-color:red";
};
orange.οnclick=function(){
one.style="background-color:orange";
};
yellow.οnclick=function(){
one.style="background-color:yellow";
};
green.οnclick=function(){
one.style="background-color:green";
};
blue.οnclick=function(){
one.style="background-color:blue";
};
indigo.οnclick=function(){
one.style="background-color:indigo";
};
purple.οnclick=function(){
one.style="background-color:purple";
};
</script>
</body>
</html>