-
123456789101112131415161718192021222324252627282930313233343536373839404142434445<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>구구단 게임</title></head><body><h1>구구단 게임하기</h1><div><script type="text/javascript">const num1=Math.floor(Math.random()*9);const num2=Math.floor(Math.random()*9);let counter=0;document.write(num1+'*'+num2+'=');const refresh =() =>{document.getElementById('result2').innerHTML='2초후 새로운 게임이 시작됩니다.';setTimeout(function(){window.location.reload();},2000);}function button_onclick(){const userinput = parseInt(document.getElementById('uinput').value);console.log(userinput);parseInt(userinput);if(num1*num2 == userinput){document.getElementById('result').innerHTML='정답입니다';//정답이므로 페이지 새로고침refresh();} else{document.getElementById('result').innerHTML= '오답입니다';counter++if(counter ==3){document.getElementById('result').innerHTML= '3번 오답으로 다음 문제로 넘어갑니다.';refresh();}}}</script><h1 id="result">정답은?</h1><input type="text" maxlength="3" id="uinput"><button onclick="button_onclick()">입력</button><h1 id="result2">정답?오답?</h1></div></body></html>cs css는 나중에 다시 공부하기러 해서 그냥 안넣었다.
퍼블리싱 공부를 제대로 해볼라고 한다.(언제가 될지는 모르겠지만)
암튼 지금은 잘된다. 시간은 document.write이거땜에 좀 오래걸렸다. 그냥 무시하고 innerHTML로 했으면 금방 끝났을텐데;....
이거 document.write했는데 새 페이지에 문구가 들어가버리는 오류가 몬지 몰라서 한참을 헤멨다.
document.write를 함수안이나 이런데에 써놓으면 document.open을 하고 쓰는거랑 똑같다는데 해결할 방법을 찾아보아야겠다.
https://www.w3schools.com/jsref/met_doc_write.asp
여기를 보면 Using document.write() after an HTML document is fully loaded, will delete all existing HTML.
그냥 삽질하지말고 document.getElementById('어쩌고').innerHTML ='어쩌고' 하는편이 차라리 속편해 보인다.
'WEB > JS' 카테고리의 다른 글
async/await + 지난번에 한거 복습 (0) 2019.10.16 Promise문법 +@ (0) 2019.10.10 프로미스 문법 (0) 2019.10.08 비동기와 콜백 (0) 2019.10.07 rest 문법 (0) 2019.10.07