Java Script

[ Java Script ] 색과 이미지 변경하기

dauneee 2022. 2. 15. 08:57

[ Color change ]

 

Coral

Green

 

 

 

< 실습 코드 >

 

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>

<style type="text/css">

#box {
   width: 100px;
   height: 100px;
   background-color: coral;
   cursor: pointer;
}

#test {
   cursor: pointer;
}

</style>

<script type="text/javascript">

   function changeColor(obj){
      obj.style.backgroundColor = "green";
   }
   
</script>

</head>
<body>

   <div id="box" onclick="changeColor(this)"></div>
   <br>
   
   <img id="test" alt="자바스크립트 실습사진" src="image/1.png">
   
   <script type="text/javascript">
   
      document.querySelector('#test').onclick=function(){
         this.src='image/2.png';
      }
      
   </script>

</body>
</html>