JAVASCRIPT Effect33 QUIZ Effect 03 퀴즈 효과03 웹디자인기능사 필기 기출문제를 이용한 주관식(여러 문제) 유형입니다. 단일 문제가 아닌 여러 문제이기 때문에 다중 선택을 위해 querySelectorAll을 사용하였고, 문제는 여러 정보를 담기 위해 객체 속에 데이터를 저장하였습니다. 원본 소스 보기 자바스크립트 퀴즈를 만들기 위한 자바스크립트 작성법입니다. 자세한 설명은 아래에 있습니다. //01. 선택자 : 다중 선택을 위해 querySelectorAll 사용 const quizType = document.querySelectorAll(".quiz__type"); //퀴즈 종류 const quizNumber = document.querySelectorAll(".quiz__question .number"); //퀴즈 번호 const q.. 2022. 8. 5. QUIZ Effect 02 퀴즈 효과03 웹디자인기능사 필기 기출문제를 이용한 주관식(여러 문제) 유형입니다. 단일 문제가 아닌 여러 문제이기 때문에 다중 선택을 위해 querySelectorAll을 사용하였고, 문제는 여러 정보를 담기 위해 객체 속에 데이터를 저장하였습니다. 원본 소스 보기 자바스크립트 퀴즈를 만들기 위한 자바스크립트 작성법입니다. 자세한 설명은 아래에 있습니다. //01. 선택자 : 다중 선택을 위해 querySelectorAll 사용 const quizType = document.querySelectorAll(".quiz__type"); //퀴즈 종류 const quizNumber = document.querySelectorAll(".quiz__question .number"); //퀴즈 번호 const q.. 2022. 8. 4. QUIZ Effect 01 퀴즈 효과01 자바스크립트를 이용하여 퀴즈를 만들 수 있습니다. 이번 퀴즈는 정답확인하기를 클릭하면 정답을 확인할 수 있습니다. 원본 소스 보기 자바스크립트 퀴즈를 만들기 위한 자바스크립트 작성법입니다. 변수선언을 통해 선택자와 문제 정보를 저장합니다. innerText를 이용하여 문제정보를 출력할 수 있는데, innerText외에 textContent도 사용할 수 있습니다. //선택자 const quizType = document.querySelector(".quiz__type"); //퀴즈 종류 const quizNumber = document.querySelector(".quiz__question .number"); //퀴즈 번호 const quizAsk = document.querySelector.. 2022. 8. 4. 이전 1 2 다음 728x90