100S00

다음문제로 넘어가보자! Quiz 주관식 확인하기 유형 1 2 3 4 5 6 d w 정답입니다! 오답입니다! 다음 문제 ??점 정답 확인! esansi@naver.com 퀴즈유형 6번은 보기를 선택하고 다음문제 버튼을 누르면 다음 문제로 넘어가는 효과로 만들어 보았다. const quizWrap = document.querySelector(".quiz__wrap"); const quizTitle = quizWrap.querySelector(".quiz__title") const quizQusetion = quizWrap.querySelector(".quiz__question") const quizChoice = quizWrap.querySelector(".quiz__choice") const dogWrap..

객관식을 선택하면 정답을 확인하는 유형. Quiz 주관식 확인하기 유형 1 2 3 4 5 d w esansi@naver.com 퀴즈효과5번은 앞의 퀴즈 효과들과는 다르게 메인 내용을 html이 아닌 javascript를 이용하여 넣었다. quiz__wrap안의 내용들을 주석 처리를 하고 자바스크립트로 넣을 것이기 때문에 quiz__wrap을 선택자로 선택한다 const quizWrap = document.querySelector(".quiz__wrap"); 그 뒤로 출력을 updataQuiz로 할 것이기 때문에 안에 문제를 넣어줘야한다. updataQuiz 안에 exam이란 변수를 설정해준다. const updateQuiz = () => { const exam = []; 문제가 들어있는 quizInfo를..

퀴즈유형 4 퀴즈유형4 코드 Quiz 주관식 확인하기 유형 1 2 3 4 5 정답입니다! 오답입니다! 정답 확인하기 esansi@naver.com 퀴즈 4는 퀴즈1,2,3과는 다르게 주관식으로 만듭니다. 객관식 선택형으로 만듭니다. input type 유형 text 일반 텍스트를 입력 받을 수 있습니다. password 패스워드를 입력 받을 수 있도록, 입력 값이 화면에 보여지지 않도록 합니다. submit 태그 내에 입력된 데이터를 서버로 전달해 줍니다. button 버튼을 생성해 줍니다. checkbox 체크박스 형태의 입력을 받을 수 있습니다. radio 라디오 버튼 형태의 입력을 받을 수 있습니다. reset 태그 안의 사용자 입력을 초기화 합니다. radio를 사용해 선택을 입력 받습니다. 4가..

Quiz 주관식 확인하기 유형 1 2 3 4 . 정답입니다! 오답입니다! 정답 확인하기 . 정답입니다! 오답입니다! 정답 확인하기 . 정답입니다! 오답입니다! 정답 확인하기 esansi@naver.com // 선택자 const quizWrap = document.querySelector(".quiz__wrap") const quizTitle = quizWrap.querySelectorAll(".quiz__title") //시험종목 /시간 const quizQusetionNum = quizWrap.querySelectorAll(".quiz__question em") //문제번호 const quizQusetion = quizWrap.querySelectorAll(".quiz__question span") /..

Quiz 주관식 확인하기 유형 1 2 . 설명 esansi@naver.com // 선택자 const quizWrap = document.querySelector(".quiz__wrap") const quizTitle = quizWrap.querySelector(".quiz__title span") const quizTime = quizWrap.querySelector(".quiz__title em") const quizQusetionNum = quizWrap.querySelector(".quiz__question em") const quizQusetion = quizWrap.querySelector(".quiz__question span") const quizAnswerConfirm = quizWrap...

퀴즈 효과 Quiz 정답 확인하기 유형 . esansi@naver.com position 속성 CSS에서 position 속성은 HTML 문서 상에서 요소가 배치되는 방식을 결정합니다. 많은 경우, position 속성은 요소의 정확한 위치 지정을 위해서 top, left, bottom, right 속성과 함께 사용됩니다. position: relative position 속성을 relative로 설정하게 되면, 요소를 원래 위치에서 벗어나게 배치할 수 있게 됩니다. 요소를 원래 위치를 기준으로 상대적(relative)으로 배치해준다고 생각하시면 이해가 쉬울 것 같은데요. 요소의 위치 지정은 top, bottom, left, right 속성을 이용해서, 요소가 원래 위치에 있을 때의 상하좌우로 부터 얼마..