정규식

eventListener(이벤트 리스너) : DOM 객체에서 이벤트가 발생할 경우 해당 이벤트 처리 핸들러를 추가할 수 있는 오브젝트 -> 이벤트 리스너를 이용하면 특정 DOM에 위에 말한 Javascript 이벤트가 발생할때 특정 함수를 호출한다.

String.match()

-> 대괄호로 묶은 건 : 문자로 인식하기

소문자 : 의미, 대문자 : 아니다

-> 검사버튼을 클릭하면 입력된 모바일 버튼을 검사하기 !

핸드폰 번호아닌데 핸드폰 번호 포함은 되어있어

2099까지 작은것

1900~1999
2000~2099까지 잡가

월 01~09(0으로시작), 10,11,12(1로시작)


날

1900년도는 넘어야 입력가능
(그 이외날짜 입력 : 년도는 다시 짜야함)

우편번호가 아니면 submit못하게 막기

★★★(연습) submit 막기!

어차피 정규식은 가지고 있고 정규식 통과못헀을때 submit막는 작업이 훨씬 중요함!!

★★★(submit 방지 event)

버튼의 click 대상으로 만들면 안됌 -> form 이 대상이어야 함

event를 취소할 수 있는건 event 객체가 할 수 있음
-> eventlistener의 매개변수

submit의 기본 동작 : action으로 이동하는걸 막기

많이 검사해야할 때 : validPostcode 같이, validEmail 등등

전부다 true일때만 submit해주고 하나라도 false가 되면 submit못하게 막기

검사결과 true,false 가지고 정규식 막을 수 있는 것!! 연습많이 하기

아이디, 비밀번호

-> 대문자, 소문자 다 됨

-> 시작하는건 지정할 필요 없음

-> 대문자,소문자 분리해서




-> @앞에 반드시 txt있을것(글자수는 모름)

최소한 한글자는 있어야하는 경우

아이디/비밀번호/비밀번호 확인/이메일 입력받아서 서브밋하기

-> 어떤 형태든 이메일이 아닌 것 같은거 검사해서 테스트 해보기

-> 안될때 커서가 자동으로 들어감

> ★★★ 모르면 알때까지 해보자 하는 마인드로 해야함

id중복체크는 프론트에서 못함
-> 이메일 체크 시 양식만 체크하지 않음
(사용자가 입력한 이메일로 인증코드 보내서 체크해야함)

브라우저 조작(broswer object model)

javascript를 이용한 화면이동

새로운 창 열기

-> 팝업창은 제일 위, 제일 왼쪽에 열림
-> 화면 중앙 계산해서 팝업창을 정중앙에 띄오보기!

• 스크린값 가지고 계산해서 뿌려주기 위해서
  -> 가끔 필요함

스크롤 내릴때마다 화면을 조금씩 붙여줌(보여줌)
-> 'height'가 변함

(원래 엄첨많은 걸 내려가는게 아니라)

스크롤바도 객체가 있음(브라우저에 포함됨)
높이 계산 -> 스크롤바가 바닥에 닿으면 새로운 목록 가지고 와서 띄워주기

history 객체(뒤로가기,앞으로가기)

-> scirpt에 적으면 진짜로 가버림

locatoin 객체 :경로 바꿔줄때 씀

-> 찾는 방법을 알아야 꺼낼 수 있음

-> for문에서 클릭 이벤트 할 수 있음

->this : event 대상 (클릭이벤트 : 클릭한 버튼이 this임)



-> 삭제 버튼을 누르면 앞에 게시물을 지우겠다(
게시물에 번호가 저장되어있어야 함-> 아니면 clickevent 만들기 어렵다)

HTML태그 안에 '값'을 넣어놓는걸 앞으로 써야함

데이터 속성 : 저장해두고 싶은 값이 있으면

site : 변수이름
naver : 값

site : 변수이름
google : 값

-> 변수는 선언 생략 가능(생략 한것)

location -> href(경로작성하고 이동)

= a태그와 같음
(a태그로 만들던가 )

적혀있으면 보고 이동하는 것

-> 자동으로 이동해야하는 상황 : locatoin

-> 사용자가 눌러서 이동 해야하는 상황 : a 태그

창 : 또다른 HTML 문서
-> 문서를 열겠음

url : 열어줄 창의 경로
target : 열어줄 창의 이름(a링크 클릭했을때 창을 열어주는것)
feature : 특징 열어주는 창의 크기, 위치

<정중앙에 오기 위한 방법>

-> 너비는 640 만들기

-> 가운데 창 뜨는지 확인하기

-> 예전에는 id중복체크 창 새로 열어서 했음

연습문제

1번 CSS문제
2번 JAVASCRIPT문제 : 내장함수, 배열, 객체 활용해서 만들기
3번 EVENT 문제 : 클릭시 전구 이미지 바꾸기 , (이전) (다음) 버튼 눌러서 이미지 바꾸기, 마우스로 선택한 이미지 보여주기
4번 체크박스를 아이콘으로 바꾸는 것 (선택했을때, 선택해지했을때 아이콘 모양 바꾸기)
5번 정답숨기기 , 표시 숨기기
6번 랜덤 : 추첨 문제 -> 선택으로 빼기(실제로 배열에서 빠져나가게끔 구현하기)