Event - 자바스크립트

See the Pen event by nilgi (@nilgi) on CodePen.

 

 

Event는 HTML 페이지 반응을 위해 사용합니다.

HTML 웹 페이지 로드될 때, HTML 입력 필드가 변경됐을 때, HTML 버튼을 클릭했을 때 등등 코드를 실행합니다.
쓰는 방법은 <event='javascript'>나 <event="javascript">처럼 '. "를 사용합니다.

 

<button onclick="document.getElementById('e1').innerHTML=Date()">눌러</button>
<p id="e1"></p> ◀ id를 사용하여 html 요소를 변경


<button onclick="this.innerHTML=Date()">눌러보시게~</button> ◀ this로 자체 요소를 변경


<button onclick="todayDate()">눌러줘ㅠ-ㅠ</button>
<script>
  function todayDate() {
  document.getElementById("d1").innerHTML = Date(); ◀ function 사용해 html 요소를 변경
}
</script>
<p id="d1"></p>

 

• event 종류
onchange : HTML 요소 변경
onclick : HTML 요소 클릭
onmouseover : HTML 요소 위에 마우스를 올렸을 때
onmouseout : 마우스가 HTML 요소에서 나올 때
onkeydown : 키를 누를 때
onload : 페이지가 로딩될 때