Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

134
Visualizações
.Value is giving a console error in javascript

I am fairly new to programming. I am fiddling around with small projects to get some experience. While I was coding, I encountered a problem. I am going to write the basic code down below. When I run the code, the console gives this error "Cannot read properties of null (reading 'value')"

function startFunction() {
  let string = document.getElementById("inputbutton").value;
  console.log(string);
}
<input id="text" placeholder="Type Something" maxlengh="50">
<button id="inputbutton " onclick="startFunction()">Submit</button>

about 4 years ago · Juan Pablo Isaza
2 Respostas
Responde à pergunta

0

You have selected the wrong element. I believe you're trying to select the

    <input>

element not the

  <button>

element. If you change

  let string = document.getElementById("inputbutton").value;

to

  let string = document.getElementById("text").value;

and it should work. The reason is that the button element doesn't support the value property. Check on w3schools' HTML DOM element table for more information. Here is the fixed code with runnable example:

function startFunction() {
  let string = document.getElementById("text").value;
  console.log(string);   
}
<input id="text" placeholder="Type Something" maxlengh="50">
<button id="inputbutton "onclick="startFunction()">Submit</button>

Here are few things to remember:

  1. Do not load the script before the document. For example, the following code will give you an error:
<script>
document.getElementById('d').innerHTML = "Hello";
</script>
<div id="d">
</div>
  1. To fix such problem, put the script after the HTML element you're trying to work with. The following code will not throw an error:
<div id="d">
</div>
<script>
document.getElementById('d').innerHTML = "Hello";
</script>

This is because the browser execute code line by line in the same order as it is written. For the first example, the script is executed before the

<div>

element is fully loaded. So, when the browser encounters the code, it can not find the

<div>

element by ID.

about 4 years ago · Juan Pablo Isaza Relatório

0

if you want to get the value of your input you can do this

 <input id="text" placeholder="Type Something" maxlengh="50" />
    <button id="inputbutton " onclick="startFunction()">Submit</button>

    <script>
      const textInput = document.getElementById('text')
      function startFunction() {
        let string = textInput.value
        console.log(string)
      }
     
    </script>

you can also use addEventListener

<input id="text" placeholder="Type Something" maxlengh="50" />
    <button id="inputbutton">Submit</button>

    <script>
      const textInput = document.getElementById('text')
      const button = document.getElementById('inputbutton')
      button.addEventListner('click',function(){
       let string = textInput.value
        console.log(string)
       })
     
    </script>
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda