수업목차

내장함수 리뷰

• 클릭할 때마다 일어나는 타이머 초기화 현상 → 전송버튼을 누를 때마다 계속해서 지정한 함수가 실행되기 때문에 함수 내에 작성한 기능 또한 초기화가 계속해서 됨. 따라서 함수 바깥에 저장을 해주고, 함수가 호출될 때 조건문을 이용해 함수를 작동시켜줌.
• 타이머가 끝내고 전송버튼을 다시 누르면 인증완료 버튼이 계속 비활성화 되어있음.
• 인증완료 버튼을 활성화 시켜주었지만 잠시 1초만 활성화 되고 다시 사라짐 → console.log()로 확인해보면, 전송버튼이 작동할 때마다 타이머가 매 초마다 계속 작동된다는 것을 알 수 있음. 따라서 setInterval 을 새로운 변수에 담아 초기화 시켜주도록 함.
• Result

이벤트 핸들러

: 함수는 `event` 를 **처리하거나 반응**하고, 애플리케이션은 **이벤트 타입**과 **이벤트 대상**을 지정해 **웹브라우저에 이벤트 핸들러 함수를 등록**한다. 그리고 지정된 대상(HTML 요소)에서 지정된 타입의 **`event`가 일어나면 브라우저가 핸들러 함수를 호출**한다.

• 종류

  onclick="자바스크립트함수();"     // 해당 태그를 클릭했을때  자바스크립트 함수 실행
  onchange="자바스크립트함수();"    // 해당 태그가 변경됐을때 자바스크립트 함수 실행
  onblur="자바스크립트함수();"      // 해당 태그에서 벗어났을때 자바스크립트 함수 실행
  

  // 버튼 클릭시, 자바스크립트함수 실행
  <button onclick="자바스크립트함수();"> 버튼 </button>
  
  // 텍스트 변경시, 자바스크립트함수 실행
  <input type="text" onchange="자바스크립트함수();" />
  
  // 포커스 아웃시, 자바스크립트함수 실행
  <input type="text" onblur="자바스크립트함수();" />
  

• QUIZ