썬키의 개발노트

키보드에서 키를 눌렀을 때 이벤트를 발생시키는 이벤트 처리기가 있다. onkeydown / onkeypress 인데 두 이벤트 처리기의 차이점을 간단하게 정리하려고 한다. 우선, 차이점을 알아보기 위해 input 태그를 하나 생성한다. 그리고 name 프로퍼티 값이 title인 input 태그에서 키를 눌렀을 때 어떤 키가 눌렸는지 확인하기 위해 keycode를 console.log()로 출력하는 script 코드를 작성한다. onkeydown input 태그에 abcdABCD를 입력했을 때 console에는 65(A),66(B),67(C),68(D)가 순서대로 반복돼서 찍히는 것을 확인할 수 있다. 소문자 a의 ASCII CODE값은 97인데 대소문자와는 상관없이 모두 대문자의 ASCII CODE값을 ..

input type이 checkbox 일 때, JS의 이벤트 핸들러를 활용해 합계 금액이 자동으로 변경되는 작고 소중한 웹 애플리케이션을 만들어보았다. HTML 소스코드 체육관 이용 요금 1 기본 사용료(4시간) 40,800원 야간조명(20,000원) 배구네트 x 2장(4,000원) 배구공 x 10(20,000원) 합계금액:원정​ JS 소스코드 우선, 이벤트 핸들러 방식 중 DOM을 조작하는 방식인 getElementsByName을 이용해 check 변수에 태그 name이 'option' 인 input 태그들을 담았다. 여기서 check 변수의 타입은 console.log()를 이용해서 확인해보면 NodeList라는 것을 알 수 있다. NodeList는 JS의 API가 아닌 Web Browser의 API..

html 태그 ①password : 입력한 문자를 대체문자(***)로 보여준다. 비밀번호 ②radio : 한개가 선택되면 나머지는 해제되는 버튼 성별 남자 여자 ③file : 브라우저의 기본 기능인, 내 컴퓨터에 있는 파일을 찾는 기능 사진 ④date : 브라우저의 기본 기능인, 달력에서 날짜를 선택할 수 있는 기능 ①checked : radio와 연동해서 쓰는 속성, 기본으로 선택되어져야 하는 곳에 넣는 다. 남자 ②placeholder : 데이터가 입력이 안됐을때 입력 예시를 백그라운드로 표시 생년 월일