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 : 페이지가 로딩될 때