★ 문제 1 아래와 같은 문서를 생성하시오. 조건 카운트 다운을 구현하시오. 카운트가 0이 되면 구글로 이동하시오. esc 키를 누르면 카운트를 중단하시오 ■ HTML 코드 ■ CSS 코드 ■ JavaScript ■ 실행 결과 ★ 문제 2 아래와 같은 문서를 생성하시오 조건 뉴스 서비스를 구현하시오. ■ HTML 코드 네, 낮동안에도 찬바람이 강하게 불고있습니다. 때문에 체감상 느껴지는 온도는 현재기온보다 2~3도가량 낮게 나타나고 있는데요. 남부해안지역과 제주도를 중심으로는 강풍주의보도 이어지고 있기 때문에 시설물 피해 없도록 주의하셔야겠습니다. 쌀쌀했던 어제보다도 기온이 더 오르지 못하고있습니다. 현재기온 서울 7.3도, 대전 9.3도, 부산 6.8도로 이맘때 평년수준을 밑돌고있고요. 찬바람이 더해지..
★ 호이스팅, Hoisting 함수 호이스팅(*), 변수 호이스팅 코드를 실행하기 전, 변수 선언문과 함수 선언문은 해당 스코프의 최상단으로 끌어올려진다. > 코드를 재배치 //호출 m1(); //선언 function m1() { alert(); } ★ 객체, Object JavaScript에는 클래스가 없다. 하지만 내장 객체를 제공한다. 1. 내장 객체 Date, Array, Math, Object, Option 등.. new Date() new Array() 2. BOM 객체 window, document, form, text, button 등.. BOM 트리 > 구성 요소들 .. 3. DOM 객체 element, attribute, text 등.. 4. 사용자 정의 객체(***) JavaScrip..
★ 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 이미지에 맞게 ..
