본문으로 바로가기




1일차



수업의 목적

HTML과 JavaScript의 만남 1 (script 태그)

HTML과 JavaScript의 만남 2 (이벤트)

HTML과 JavaScript의 만남 3 (콘솔)

데이터타입 - 문자열과 숫자

변수와 대입 연산자

웹브라우저 제어

CSS 기초

제어할 태그 선택하기

프로그램, 프로그래밍, 프로그래머

조건문 예고

비교 연산자와 Boolean 데이터 타입

조건문

조건문의 활용

리팩토링(refactoring)

반복문 예고

배열

반복문

배열과 반복문

배열과 반복문의 활용

함수예고

함수

함수의 활용

객체예고

객체

객체 활용

파일로 쪼개서 정리 정돈하기

라이브러리와 프래임워크

UI vs API

수업을 마치며





#4. HTML과 JavaScript의 만남 2 (이벤트)


▲ 버튼모양 입력



- 버튼모양 : "button" 

- 글 적고 싶은 경우 value=""




▲ 버튼 클릭시, 경고창 팝업시키기 



- onclick="alert"

 > 더 다양한 예시보기




▲ onchange 이벤트 - 화면 밖 클릭시, 이벤트 발생


Definition and Usage[각주:1]


The onchange event occurs when the value of an element has been changed.

For radiobuttons and checkboxes, the onchange event occurs when the checked state has been changed.

Tip: This event is similar to the oninput event. The difference is that the oninput event occurs immediately after the value of an element has changed, while onchange occurs when the element loses focus, after the content has been changed. The other difference is that the onchange event also works on <select> elements.




▲ onkeydown 이벤트 - 키를 입력시 발생하는 이벤트


Definition and Usage [각주:2]


The onkeydown attribute fires when the user is pressing a key (on the keyboard).


Tip: The order of events related to the onkeydown event:

onkeydown

onkeypress

onkeyup




▲ 이벤트 (EVENT)



 *EVENT = 사람들에게 유용할만한 속성 부여 (≒소통)








  1. https://www.w3schools.com/jsref/event_onchange.asp [본문으로]
  2. https://www.w3schools.com/tags/ev_onkeydown.asp [본문으로]