デジタルクイズゲーム(課題3)

2111 ワード

const generateNum = document.getElementById("generateNum");
const guessNum = document.getElementById("guessNum");
const btn = document.getElementById("btn");
const printDiv = document.getElementById("printDiv");
const youChoseNum = document.getElementById("youChoseNum");
const machineChoseNum = document.getElementById("machineChoseNum");
const won = document.getElementById("won");
const lost = document.getElementById("lost");

const CLASS_HIDDEN = "hidden";

function submitBtn(event) {
  event.preventDefault();
  printDiv.classList.remove(CLASS_HIDDEN);
  const randomNum = Math.floor(
    Math.random() * (parseInt(generateNum.value) + parseInt(1))
  ); // parseInt로 정수 변환하여 덧셈연산 해준다.
  youChoseNum.innerText = guessNum.value;
  machineChoseNum.innerText = `${randomNum}.`;
  if (guessNum.value == randomNum) {
    won.classList.remove(CLASS_HIDDEN);
    lost.classList.add(CLASS_HIDDEN);
  } else {
    lost.classList.remove(CLASS_HIDDEN);
    won.classList.add(CLASS_HIDDEN);
  }
}

btn.addEventListener("click", submitBtn);
本課題の核心は,乱数を生成することである.
ユーザーが指定した数値範囲内でランダムな数値を検索する必要があります.
ランダム数値条件:入力値が0より大きい(指定値)
Math.random():0または1未満の数を作成します.
generateNum.valueに1を足すとMath.0を含む条件を満たすにはrandom()を乗算します.
0を含めるには、Mathを使用します.floor()を使用する必要があります.
ここでNumを生成します.valueと1は、エラーが発生しないようにParseInt()を使用して整数に変換する必要があります.
整数変換なしgenerateNum.value+1は//3+1=31を表し、このように値を返します.
// 0이상 10미만의 랜덤한 정수 생성
Math.floor(Math.random() * 10)      

// 1이상 11미만의 랜덤한 정수 생성 
Math.floor(Math.random() * 10) + 1 
classList.add, classList.removeを使用してタグのクラスプロパティを追加または削除し、ブラウザ画面の表示部分を制御します.(display:none、スクリーン上の要素の占有スペースが消失)
  • で選択した要素の属性値を設定します.
    element.setAttribute('attribute_name','attribute_value');
  • jsはhtmlタグの内部文字を取得するために使用される.
    innerHTML:タグを認識してタグを適用すると文字が表示されます.
    innerText:このElementからユーザーの「表示」テキスト値を取得します.
    textContent:IndetTextとは異なり、<script>または<style>タグに関係なく、解析ノードが持つテキスト値を直接読み取ります.