꾸준함이 말미암아

disabled 모든 포커스를 받을 수 있는 요소(선택, 클릭, 입력 등)를 비활성화 합니다. ▶ 구문 input요소.disabled = true //비활성 input요소.disabled = false //활성 ▶ 예시 버튼을 클릭하면 텍스트 입력과 체크박스 요소를 비활성화 합니다. disabled 텍스트 입력 : 버튼 클릭 : 체크박스 클릭 : HTML 삽입 미리보기할 수 없는 소스 예제 이름, 주소, 우편번호를 입력할 수 있는 배송지와 청구지를 생성하시오. '배송지와 동일' 이라는 체크박스를 청구지에 생성하고 체크시 배송지의 이름, 주소, 우편번호가 청구지 입력 텍스트에 자동으로 입력되며 더 이상 입력할 수 없는 상태로 만드시오. ▶ 해법 1. body에 form을 생성합니다. 배송지 청구지 배송지와..

문제 아래와 같은 경품과 확률이 있습니다. 화면에 버튼을 누르면 아래와 같은 확률로 경품이 화면에 출력되는 코드를 작성하시오. 단 경품 추첨 버튼은 한번만 클릭이 가능합니다. 경품 확률 iMAC PRO 5% MAC BOOK PRO 15% iPAD PRO 30% 다음 기회에 50% 해법 1. body에 form을 생성합니다. 경품 뽑기 경품 목록 1등 iMAC PRO 2등 MAC BOOK PRO 3등 iPAD PRO 결과 2. 경품을 리턴하는 함수를 작성합니다. const getPrize = function() { //랜덤값 생성 (1~100) const ranNum = Math.floor((Math.random() * 99) +1) //경품 생성 const gift = ['1등 iMAC PRO', '2등..

문제 개인정보를 입력하고 모든 사항에 동의하면 경품을 주는 이벤트 페이지를 만들고자 한다. 이벤트 당첨 경품과 확률은 아래와 같다. 아래와 같이 개인정보 Form을 생성하라. 동의 버튼을 누르면 경품 추첨을 통해 경품을 지급하는 코드를 작성하시오. 동의 버튼은 경품이 추첨되고 나서부터 한번만 처리되어야합니다. 동의 버튼 클릭시 이름, 이메일, 주소가 빠지면 메시지를 띄워줘야합니다. 이메일은 이메일 형식 검사를 해야합니다. (@의 여부, @뒤에 .의 여부, .뒤에 com, kr, net 등의 여부) 모든 동의 사항이 체크되지 않으면 경품지금이 되지 않는다는 메세지를 띄워줘야 합니다. 모든 사항에 동의를 누르면 자동으로 모든 체크박스가 체크되어야합니다. 하위 동의사항중 하나라도 체크하지 않으면 전체동의는 체..

문제 모든 checkbox를 checked하는 '전체동의'와 각각의 '개인정보 사용 동의', '마케팅 수신 정보 동의', '제3자 정보 전달 동의', '기타 정보 수집 동의' 의 checkbox를 작성하시오. 전체 동의 체크시 하위 동의란이 체크되어야합니다. 하위 동의란이 비체크시 전체 동의 체크가 비동의 되어야 합니다. 해법 1. body에 각각의 checkbox를 생성한다. 전체동의 개인정보 사용 동의 마케팅 수신 정보 동의 제3자 정보 전달 동의 기타 정보 수집 동의 2. 각각의 checkbox를 불러온다. document.addEventListener('DOMContentLoaded', () => { const ckTag = document.getElementById('id_a') const ev..

문제 추가 버튼을 누르면 테이블 row가 추가되고 초기화 버튼을 누르면 초기화 되는 코드를 작성하시오. 과일명은 '사과', '배', '딸기', '바나나', '귤' 중 랜덤 값 수량은 1~10 사이 랜덤 값 해법 1. body에 table과 button을 생성한다. 번호과일명수량 추가 초기화 2. 순차적으로 번호를 뽑는 함수, 과일명을 랜덤으로 리턴하는 함수, 수량 값을 랜덤으로 리턴하는 함수를 생성한다. //순차적 번호 리턴 함수 let _num = 0; const num = function (){ _num = _num + 1; return _num; } //과일명 랜덤 리턴 함수 const frtNme = function(){ const frt = ['사과', '배', '딸기', '바나나', '귤'] ..

문제 1~5개의 주사위의 갯수를 받아 각각의 주사위 값을 화면에 출력하시오. 함수의 결과값을 object type으로 만들고 화면 출력을 아래와 같이 하시오. 조건에 맞는 주사위의 갯수를 입력하지 않을시 메세지를 출력하시오. Ex) A : 4 , B : 5 해법 1. n개의 주사위를 입력 했을 때 주사위의 결과를 출력하는 함수를 작성합니다. const getDiceNumber = (_num) => { if (_num > 5 || _num < 1){ return 'The number of dice has been exceeded.' } else{ //난수의 배열 let ranNum = []; //알파벳 문자열 const alpha = ['A', 'B', 'C', 'D', 'E']; //결과값 object ..

문제 원의 둘레와 넓이를 출력하시오. 조건 반지름과 원주율에 문자와 음수는 입력되지 않습니다. 원주율을 사용자가 선택할 수 있습니다. '𝝿', '3.14', '사용자 입력(단 3.14보다 크고 3.15보다 작음)' '𝝿'를 이용하여 계산할 시 결과 값이 ~𝝿로 끝나야 함. (공식 참고) class를 이용하십시오. private를 적용하십시오. 둘레와 원주율의 getter, setter가 클래스 안에 존재해야 합니다. 입력한 원주율의 값이 출력되어야 합니다. 반지름과 원주율이 입력되지 않을 경우 각각 1과 3.14의 값을 가집니다. 해법 1. class를 생성합니다. private를 적용합니다. constructor를 생성합니다. radius와 pi를 생성합니다. Protection method를 생성하여..

Event * window시스템과 javascript의 event system은 동일하다. 메시지가 라우팅 된다. Event : 어떤 조건이 만족될 때 발생되는 신호 // 마우스 왼쪽 버튼 클릭 더보기 1개의 이벤트는 1개의 메시지와 2개의 옵션 값을 가진다. - Linux Message : 이벤트의 값. //마우스 왼쪽 버튼 클릭의 다운 신호 값 = 메시지 코드 + 32Bit Parameter + 32Bit Parameter 더보기 https://docs.microsoft.com/ko-kr/windows/win32/inputdev/wm-lbuttondown Event Handler : 이벤트 발생 시 호출되는 함수 event listene라고도 함. 자바스크립트의 이벤트 처리 시스템은 callback ..

Event문서 객체 (DOM/ Document Object Model) 웹 브라우저는 HTML 페이지에 있는 Element 들을 트리 형식으로 메모리에 로딩한다. 이때 각 노드를 "document object"라 한다. 웹 브라우저는 이러한 문서 객체를 접근할 수 있도록 API(데이터 + 기능)를 제공하는데 이를 "문서 객체 모델(DOM)"이라고 한다. JS는 DOM을 호출/제어하기 위한 가장 보편적 언어이다. 트리구조가 파일 시스템에서 사용될 때 'NODE'를 '파일'이라고 부른다. 트리구조가 웹브라우저에서 정보를 표현하는데 사용할 때 'NODE'를 'document Object'라고 부른다. * Element = Tag + content * API = Application Programming Int..

static static element(속성), static method(메서드) 전역화 지역변수 또는 전역화 지역 메서드를 만들기 위한 키워드 staitc은 전역 영역에 존재하기 때문에 static 입장에서 class는 "소속"의 개념일 뿐이다. static 변수, static 메서드는 class가 인스턴스화 되는지 여부와 전혀 관계없다. static 메서드의 this는 의미가 없다. static 변수도 접근제어가 가능하다. * 프로그램이 시작해서 종료될 때 까지 메모리가 유지된다. 문법 static methodName() { ... } 설명 정적 메서드는 클래스의 인스턴스 없이 호출이 가능하며 클래스가 인스턴스화 되면 호출할 수 없습니다. 정적 메서드는 종종 애플리케이션의 유틸리티 함수를 만드는 데 ..