국비 교육/프론트엔드18 [자바스크립트] (예제) 배달음식 주문 예제 요구사항- 기능- changeTime() 함수 : 현재 시간 = 프로그램이 시작된 시간을 기준으로 1초마다 시간이 업데이트 되도록- confirmEvent() 함수 : 코드 내의 menulist 변수와, menuqty 변수에 값을 변경했을 때 계산할 수 있도록 이벤트 걸기-calcPrice() 함수: 각 음식의 주문 수량을 변경했을 때 계산하는 함수- orderCheck() 함수 : 주문하기 버튼을 클릭했을 때 사용자 입력검증 ∘ 주문자 이름: 주문자 이름은 반드시 입력 받기, 만약 입력 받지 않을 경우 "주문자 이름을 입력해 주세요" 라는 경고창 띄우기 ∘ 전화번호: 숫자 11 자리로 입력 받기, 그렇지 않으면 "전화번호는 11 자리 숫자로 입력해 주세요" 라는 경고창 띄우고 전화번호에 포.. 2024. 3. 10. [자바스크립트] (예제) 종합 평가 점수 계산하기 요구사항- 기능1. 최종 파일은 3개 (*.html, *.css, *.js)로 분리하여 작성한다.2. 7개의 과목은 0~100사이의 점수로 입력 받는다. 점수 범위를 벗어나거나 문자열이 입력될 경우 경고창 출력 3. “결과 확인” 버튼을 클릭하면 종합점수가 출력된다. 종합점수 = 각 과목은 10% + 프로젝트 2회 20% + 출석률 20%- 디자인 (크기와 글꼴, 색상은 임의의 값을 사용한다.)1.웹 문서 전체 배경색 지정2. 글꼴은 지정된 글꼴 외에 구글 웹 폰트 사용3. 전체 화면은 가운데로 정렬 4. 입력상자의 초기값은 오른쪽 정렬5. 결과확인 버튼 : 모서리 라운드처리, 배경색상 그라데이션(임의의 값), 마우스를 올리면 그림자 처리, 결과확인 .. 2024. 3. 9. [자바스크립트] Node , 고객관리 프로그램 예제 DOM Node 접근 처리 예제 DOM Node 접근 처리 insertAdjacentHTML의 첫 번째 속성 종류 beforeend : 닫는 태그 바로 앞 beforebegin : 시작 태그 바로 앞 afterend : 닫는 태그 바로 뒤 afterbegin: 시작 태그 바로 뒤 뼈해장국 우삼겹짬뽕 오므라이스 " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 들어갈 데이터let data ='순대국밥'; 1) beforebegin : 시작 태그 바로 앞.. 2024. 3. 9. [자바스크립트] classList, 예제- 다크모드 버튼 구현 classList 자바스크립트 classList 객체 연습 " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 html 본문에서 사용한 id 위치 자바스크립트 classList 객체 연습 let target = document.getElementById('target');let content = document.getElementById('content'); - output() : 문서에 작성하는 함수function output(data){ target.innerHTML = data;} 1) 클래스명 가.. 2024. 3. 9. [자바스크립트] 회원가입 검증 예제 회원가입 검증- 아이디 길이는 3~5 글자 사이로 입력받는다.- 비밀번호의 길이는 3~5글자 사이로 입력받고, 비밀번호 확인과 값이 같아야 한다.- 이름은 입력받기만 하면 된다.- 성별과 취미는 읽어오기만 할것- 전화번호 : 국번은 select상자이므로 읽어오기만 하고, 나머지 번호는 반드시 숫자 8자리(입력상자 하나로)- 정확히 모든 데이터를 입력하면 경고창에 결과를 출력하시오 ( 모든 정보와 결과는 경고창으로 ) html 본문 회원 가입 아이디 .. 2024. 3. 9. [자바스크립트] 함수 - 4 (수학관련 함수) Math수학과 관련된 값이나 함수를 제공한다. - Math 에 선언된 상수console.log(`원주율 : ${Math.PI}`);console.log(`오일러 상수 : ${Math.E}`); - Falsy & TrulyFalsyTrulyFalsy 값으로 판정하는 데이터Truly 값으로 판정하는 데이터0, null, undefined, ' ' [], 비어있지 않은 문자열, 0을 제외한 모든 숫자 - abs절대값 반환console.log(Math.abs(-1)); // 1console.log(Math.abs('-2')); // 2console.log(Math.abs(null)); // 0console.log(Math.abs('')); // 0console.log(Math.abs(' ')).. 2024. 3. 9. 이전 1 2 3 다음
