검색창과 버튼창이 사라집니다

웹 게임을 만들며 배우는 자바스크립트

구구단 화면 만들기

작성

197

var number1=Math.ceil(Math.random()*9);
var number2=Math.ceil(Math.random() * 9);

var body=document.body;
var word=document.createElement('div');
var form=document.createElement('form')
var input=document.createElement('input');
var button=document.createElement('button');
var text=document.createElement('div');

word.textContent=`${number1} 곱하기 ${number2} 는?`;
body.append(word);
word.append(form);
form.append(input);
form.append(button);
button.textContent='확인'


form.addEventListener('submit',(e)=>{
    e.preventDefault();
    if(input.value==number1*number2){
        alert('정답입니다')
        number1 = Math.ceil(Math.random() * 9);
        number2 = Math.ceil(Math.random() * 9);
        word.textContent = `${number1} 곱하기 ${number2} 는?`;
        input, value = '';
        input.focus();
    }
    else{
        input.focus();
        alert('틀렸습니다')
    }
})

이렇게 코드를 짜보았는데 똑같이한거같은데 전송을 하고나면

검색창과 버튼창이 사라집니다

javascript

답변 4

이선숙

1. input, value = ''; ---> input. value = '';

2. word.append(form); ---> body.append(form);

applebear295

저도 배우는 입장이지만 재 생각은 폼태그는 div 밖인 body태그에 있어야 한다고 생각합니다. word의 div는 단지 문제를 내는것이고 form은 버튼을 눌렀을때 발생하는 이벤트를 만들기 위해 생성된 태그라서 서로 다른겁니다.

jfmam

질문자

word.append(form);

이부분을 document.body.append로 작성하니 잘되었습니다.

word.append로 하였을때는 검색창이 사라지는 이유가궁금합니다

제로초(조현영)

지식공유자

input.value = '' 오타입니다.

인프런 커뮤니티 질문&답변

검색창과 버튼창이 사라집니다