★ Variable 변수 선언하기 BOM ~ DOM ~ ES6 function-scoped 중복 선언 가능 상수 선언 불가능 전역 멤버(전역변수, 함수)는 자동으로 window 객체의 멤버(프로퍼티)가 된다. var a = 10; //a : 전역 변수 for (var p in window) { //p : 전역 변수 console.log(p); } ■ 객체가 가지는 프로퍼티를 탐색하는 루프(향상된 for문 아님 X) or(var p in screen) { console.log(p); } console.log('------------------------'); for(var p in document.all.txt1) { console.log(p); } ★ 변수 선언하기 1. var 2. let ES6 blo..
★ Timer 타이머 생성 1. number setTimeout(함수, 시간) : 1회성 타이머 btn1.onclick = m1; function m1() { //3초 후에 f1을 호출해라! //setTimeout(f1, 1000); f1(); } function f1() { // alert('따르릉'); txt1.value = (new Date()).toLocaleTimeString(); setTimeout(f1, 1000); //재귀 호출 + 무한 루프 } 2. number setInterval(함수, 시간) : 반복성 타이머 btn2.onclick = m2; function m2() { setInterval(f2, 1000); } function f2() { // alert('띵동~'); txt2...
★ 문제 1 아래와 같은 문서를 생성하시오. 조건 새창을 띄운 뒤 우편 번호 검색을 하시오. 우편번호, 주소 : 새창에서 선택하면 자동 채우기 상세주소 : 포커스 맞추기 ■ HTML 코드 우편 번호 검색 우편번호 주소 상세주소 ■ css 코드 ■ JavaScript ■ 008search.html ■ 실행 결과 ★ 문제 2 아래와 같은 문서를 생성하시오. 조건 주문하시는 분 정보를 받으시는 분으로 복사하시오. ■ HTML 코드 주문하기 주문하시는 분 이름 : 주소 : 주문하시분과 정보과 동일합니다. 받으시는 분 이름 : 주소 : ■ CSS 코드 X ■ JavaScript ■ 실행 결과 ★ 문제 3 아래와 같은 문서를 생성하시오. 조건 주민번호 입력 시 나머지 컨트롤(생년월일, 성별) 제어를 하시오. 주민등..
★ Radio HTML 코드 라디오 버튼 흰색 빨간색 노란색 파란색 검은색 CSS 코드 JavaScript 실행 결과 ★ Range HTML 코드 배경색(RGB) R : G : B : CSS 코드 JavaScript 실행 결과 ★ Select HTML 코드 셀렉트 박스 강아지 고양이 돼지 닭 사자 호랑이 낙타 태어난 년도 : CSS 코드 X JavaScript 실행 결과
★ 회원가입 form HTML 코드 회원 가입 이름 나이 아이디 암호 암호확인 JavaScript 코드 document.form1.btn.onclick = m1; function m1() { var txtname = document.form1.txtname; var txtage = document.form1.txtage; var txtid = document.form1.txtid; var txtpw = document.form1.txtpw; var txtpwc = document.form1.txtpwc; } 유효성 검사 > 잘못된 값을 찾기!! 1. 이름 유효성 검사 //유효성 검사 > 잘못된 값을 찾기!! //이름 //- 필수값 //- 2~5자 이내 //- 한글만 if(txtname.value == '..
★ 문제 1 아래와 같은 문서를 생성하시오. 조건 롤 오버 이미지를 구현하시오. 고양이 강아지 cat01.jpg dog01.jpg ■ HTML 코드 ■ CSS 코드 ■ JavaScript ■ 실행 결과 ★ 문제 2 아래와 같은 문서를 생성하시오. 조건 롤 오버 이미지를 구현하시오. 버튼을 클릭하면 새창으로 이미지를 띄우시오. dog01.jpg(기본 크기) dog01_big.jpg(큰 크기) ■ HTML 코드 강아지1 강아지2 강아지3 강아지4 강아지5 ■ CSS 코드 ■ JavaScript ■ 실행 결과 ★ 문제 3 아래와 같은 문서를 생성하시오. 조건 롤 오버 이미지를 구현하시오. img01.jpg img04.jpg img02.jpg img05.jpg img03.jpg img06.jpg 이미지에 맞게 ..
★ Event > 다량의 요소(태그)의 (일괄) 처리 버튼을 통한 배경색 변경 방법 1 : 정적으로 일일이 각자 생성 방법 2 : 동적으로 일일이 각자 생성 document.all.btnRed2.onclick = m4; document.all.btnYellow2.onclick = m5; document.all.btnBlue2.onclick = m6; function m4() { document.body.bgColor = 'red'; } function m5() { document.body.bgColor = 'yellow'; } function m6() { document.body.bgColor = 'blue'; } 방법 3 : 함수 하나로, 매개변수를 받아 설정 방법 4 : this를 이용한 함수 방법 ..
★ 메시지 박스, 대화상자 1. void alert(message); document.form1.btn1.onclick = m1; function m1() { // alert(); // alert(100); alert('문자열'); } 실행 결과 2. boolean confirm(message); document.form1.btn2.onclick = m2; function m2() { if(confirm('정말 삭제하겠습니까?')){ document.body.bgColor = 'blue'; }else { document.body.bgColor = 'white'; } } 실행 결과 3. string prompt(message, value); document.form1.btn3.onclick = m3; fu..
