01. 퀴즈 이벤트

정답 확인버튼을 누르면 정답이 나오는 효과입니다.

  • 데이터 저장하기 : 변수
  • querySelector() : 문서에서 특정 CSS선택자를 DOM메서드 입니다.
  • innerText : DOM 요소의 텍스트 내용을 가져오거나 실행하느데 사용되는 속성입니다.
  • style.속성 = "속성값" : 자바스크립트에서 CSS스타일을 표현하는 방법입니다.
  • classlist : 자바스크립트에서 요소의 클래스를 추가&제거하여 스타일을 설정하는데 사용
  • addEventListener() : 자바스크립트에서 이벤트를 처리 하는 함수
확인하기

02. 퀴즈 이벤트 : 주관식 확인하기 유형

입력받은 값이 정답인지 오답인지 확인해주는 효과입니다.

  • 데이터 저장하기 : 변수
  • 데이터 제어하기 : if문
  • trim() : text값에 공백 제거
  • value : input받은 값의 value를 가져옴!
확인하기

03. 퀴즈 이벤트 : 주관식 확인하기 유형(여러문제)

체크한 값이 맞는지 확인하는 효과입니다.

  • 데이터 제어하기 : if문
  • 데이터 저장하기 : 배열, 객체
  • 데이터 불러오기 : for문, forEach()
  • querySelectorAll()
  • innerHTML
확인하기

04. 퀴즈 이벤트 : 객관식 확인하기 유형

객관식을 선택하면 정답을 확인하는 유형

  • 데이터 저장하기 : 배열, 객체
  • 데이터 불러오기 : 배열, 객체, for문, forEach()
  • 데이터 실행하기 : 함수
  • 데이터 제어하기 : if문, 다중if문
  • innerHTML
확인하기

05. 퀴즈 이벤트 : 객관식 확인하기 유형(여러문제)

객관식을 선택하면 정답을 확인하는 유형

  • 데이터 저장하기 : 배열, 객체
  • 데이터 불러오기 : 배열, 객체, for문, forEach()
  • 데이터 실행하기 : 함수, 익명함수, 화살표함수
  • 데이터 제어하기 : if문, 다중if문
  • 배열 객체 : push(), join()
  • 수학 객체 : Math.ceil
  • 요소 메서드 : querySelector(), querySelectorAll(), getAtrribute()
  • innerHTML
확인하기

06. 퀴즈 이벤트 : 객관식 확인하기(슬라이드) 유형 (여러문제)

객관식을 선택하면 정답을 확인하는 유형이고 슬라이드 형식으로 확인합니다.

  • 데이터 저장하기 : 배열
  • 데이터 불러오기 : 배열, for ,Json 타입
  • 데이터 실행하기 : Json 타입
  • 데이터 제어하기 : if문, forEach문, for문
  • 배열 객체 : push()없이 script로 data 뿌려주기
  • 수학 객체 : Math.ceil
  • 요소 메서드 : querySelector(), querySelectorAll(), getAtrribute()
  • innerHTML
확인하기

07. 퀴즈 이벤트 : CBT 유형

객관식을 선택하면 정답을 확인하는 유형이고 슬라이드 형식으로 확인합니다.

  • 데이터 저장하기 : 배열
  • 데이터 불러오기 : 배열, for ,Json 타입
  • 데이터 실행하기 : Json 타입
  • 데이터 제어하기 : if문, forEach문, for문
  • 배열 객체 : push(), join() script로 뿌려주기
  • 수학 객체 : Math.round, Math.random
  • 요소 메서드 : querySelector(), querySelectorAll(), getAtrribute()
  • innerHTML
확인하기