Uncaught Typeerror: cannot read Property 'value' of null

Asked

Viewed 604 times

-3

This is a small project to train(it recommends series according to the data) and gives the following error in value by clicking 'ok'':

Uncaught TypeError: cannot read property 'value' of null

html code:

function ok() {
  var data = new Date()
  var ano = data.getFullYear()
  var fano = document.querySelector('txtidade')
  var res = document.querySelector('div#res')
  var img = document.createElement('img')
  img.setAttribute('id', 'foto')
  if (fano.value.length == 0 || Number(fano.value) > ano) {
    window.alert('[ERRO] DADO INVÁLIDO! VERIFIQUE E TENTE NOVAMENTE!')
  } else {
    var sex = document.getElementsByName('radsex')
    var idade = ano - Number(fano.value)
    var genero = ''
    var gosto = ''
    var periodo = ''
  }

}
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Séries.com</title>
  <script src="interação.js"></script>
</head>

<body>
  <header>QUAL SÉRIE COMBINA COM VOCÊ?!</header>
  <section>
    <div>
      <p>
        Primeiro, digite o ano de seu nascimento:
        <input type="number" name="txtidade" id="txtidade" min="0">
      </p>
      <p>
        Sexo:
        <input type="radio" name="radsex" id="mas" checked>
        <label for="mas">Masculino</label>
        <input type="radio" name="radsex" id="fem">
        <label for="fem">Feminino</label>
        <input type="radio" name="radsex" id="outro">
        <label for="outro">outro</label>
      </p>
      <p>
        O que você prefere?
        <input type="radio" name="genre" id="misteri" checked>
        <label for="misteri">Mistério/suspense</label>
        <input type="radio" name="genre" id="comed">
        <label for="comed">Ação/comédia</label>
      </p>
      <p>
        <input type="radio" name="period" id="dia" checked>
        <label for="dia">Dia</label>
        <input type="radio" name="period" id="noite">
        <label for="noite">Noite</label>
      </p>
      <p>
        <input type="button" value="OK!" onclick="ok()">
      </p>
    </div>
    <div id="res">
      Preencha e veja!
    </div>
  </section>
  <footer>
    <p>&copy; All rights reserveds</p>
  </footer>
  <link rel="stylesheet" href="modelo.css">
</body>

</html>

javascript html html5
  • 1

    This is wrong var fano = document.querySelector('txtidade'), lacked the # in the id selector #txtidade

  • 1

    Thank you! I replaced "queryselector" with "getElementsbyid" and it also worked without using the required queryselector.

  • If you have found a solution to your post problem as answer and mark as accepted answer so that the question is closed and help others as well.

1 answer

0


I replaced "queryselector" with "getElementsbyid" and it also worked without using the required queryselector.

Browser other questions tagged javascript html html5

You are not signed in. Login or sign up in order to post.