尝试查找对输入表单的响应时，getElementById 总是 returns null

Question

我正在尝试学习 JavaScript 并且我已经多次将此输入代码与 getelementbyid 重用，但突然间它决定中断并且 return 除了 null 和我不知道如何修复它。

function FindRadioButton() {
  const rbs = document.querySelectorAll('input[name="choice"]');
  let selectedValue;
  for (const rb of rbs) {
    if (rb.checked) {
      selectedValue = rb.value;
      break;
    }
  }
  return selectedValue
}

function andorxor(num1, num2) {
  num1 = parseInt(document.getElementById("num1").value)
  num2 = parseInt(document.getElementById("num2").value)
  operator = FindRadioButton()
  if (operator == "AND") {
    document.getElementById("replaceable").innerHTML = num1 & num2

  } else if (operator == "OR") {
    document.getElementById("replaceable").innerHTML = num1 | num2

  } else if (operator == "XOR") {
    document.getElementById("replaceable").innerHTML = num1 ^ num2

  }
}

<h1>AND OR XOR BITWISE OPERATIONS</h1>

<form id="numbers">
  <input type="radio" id="AND" name="ANDORXOR" value="AND">AND <br>
  <input type="radio" id="OR" name="ANDORXOR" value="OR">OR <br>
  <input type="radio" id="XOR" name="ANDORXOR" value="XOR">XOR <br> First number: <input type="text" id="num1"><br> Second number: <input type="text" id="num2"><br><br>
  <input id="btn" type="button" onclick="andorxor(0, 0)" value="Calculate">
</form>

<p id="replaceable">Click "Calculate"</p>

Answer 1

getElementById 很好，您在 FindRadioButton 函数中使用了错误的名称：

const rbs = document.querySelectorAll('input[name="choice"]');

name="choice" 应与您输入的名称匹配：name="ANDORXOR":

<h1>AND OR XOR BITWISE OPERATIONS</h1>

<form id="numbers">
  <input type="radio" id="AND" name="ANDORXOR" value="AND">AND <br>
  <input type="radio" id="OR" name="ANDORXOR" value="OR">OR <br>
  <input type="radio" id="XOR" name="ANDORXOR" value="XOR">XOR <br> First number: <input type="text" id="num1"><br> Second number: <input type="text" id="num2"><br><br>
  <input id="btn" type="button" onclick="andorxor(0, 0)" value="Calculate">
</form>

<p id="replaceable">Click "Calculate"</p>

<script>
  function FindRadioButton() {
    const rbs = document.querySelectorAll('input[name="ANDORXOR"]');
    let selectedValue;
    for (const rb of rbs) {
      if (rb.checked) {
        selectedValue = rb.value;
        break;
      }
    }
    return selectedValue
  }

  function andorxor(num1, num2) {
    num1 = parseInt(document.getElementById("num1").value)
    num2 = parseInt(document.getElementById("num2").value)
    operator = FindRadioButton()
    if (operator == "AND") {
      document.getElementById("replaceable").innerHTML = num1 & num2

    } else if (operator == "OR") {
      document.getElementById("replaceable").innerHTML = num1 | num2

    } else if (operator == "XOR") {
      document.getElementById("replaceable").innerHTML = num1 ^ num2

    }
  }
</script>
javascript html typeerror

Answer 2

帮自己一个忙，从 Udemy 获取这门课程。 Max 是最好的老师，我已经购买并学习了他的许多课程。他的Angular课程对我帮助很大，我现在是一家大公司的前端技术负责人

https://www.udemy.com/course/javascript-the-complete-guide-2020-beginner-advanced/

尝试查找对输入表单的响应时，getElementById 总是 returns null

getElementById always returns null when trying to find response to an input form

html

javascript

getelementbyid