반응형
그동안 자바 스크립트 사용을 오래 안했네..
감이 가물가물...
몽땅 잃어버리기전에 간단한 프로그램하나 만들어봐야겠다.
아주간단한 배열, 함수, 객체 반복문, 조건문 같은 개념 이용해서 연락처 리스트 만들어보기!
프로그램 예)
연락처 리스트 | ||||||
이름 | 나이 | 연락처 | 주소 | 직업 | 취미 | |
홍길동 | 28 | 010-1234-5678 | 서울시 관악구 신림로 18 | 학생 | 볼링 | |
김귀남 | 29 | 010-5468-5466 | 서울 종로구 인사동길 100 | 학생 | 축구 | |
김동글 | 30 | 010-6879-7866 | 서울 관악구 신림로 14 | 학생 | 복싱 | |
추가하기 | 저장하기 | 찾기 | 삭제 | |||
1 |
추가하기 누르면 위에 표에 칸이 생긴다. | |||||
2 | 추가된 빈간이 생긴곳에 마우스 클릭을 하면 텍스트가 활성화되면서 글을 적을 수 있다. | |||||
3 | 저장하기를 누르면 리스트에 뿌려진다. | |||||
4 | 텍스트 입력중인 상태에서 찾기나 삭제를 누르면 alert로 입력한 내용이 지워진다는 경고를 표시한다. | |||||
추가하기를 눌러야만 저장하기 버튼을 누를 수 있다. | ||||||
5 | 찾기 버튼을 누르면 promt 창을 열어서 찾을 이름을 검색하게 한다. | |||||
6 | 확인을 누르면 검색결과가 리스트에 뿌려진다. | |||||
7 | 모두보기 버튼을 누르면 모든 리스트가 다 뿌려 진다. | |||||
8 | 삭제버튼을 누르면 창이하나 뜬다. 삭제할 이름을 적고 엔터치면 관련 데이터 삭제 | |||||
or | 행을 클릭하고 삭제버튼 누르면 삭제되게 |
반응형
'매일코딩 > 자바스크립트예제' 카테고리의 다른 글
[초미니프로젝트] 자바스크립트 연락처 저장하기 오류발생! 해결! [3] (0) | 2017.05.24 |
---|---|
[초미니프로젝트] 자바스크립트 연락처 저장하기 구현 [2] (0) | 2017.05.23 |
12.자바스크립트 기초 문법 (FORM) (4) | 2016.12.29 |
11.자바스크립트 기초 문법 (window) (4) | 2016.12.29 |
왕 기초 자바스크립트 - 함수 (4) | 2016.12.29 |
댓글