Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Qual é o problema no código?

Referente ao curso Lógica de Programação I: comece na carreira com JavaScript

por Ana Paula Jesus Batista
| 67.2k xp | 27 posts
Estudante 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>BINGO! Á</title>
    <script>
      var caixadetexto = document.getElementById("textin");
      var botao = document.getElementById("enviar");
      var bingo = [];
      var adicionarsortiado = function() {
        var numero = caixadetexto.value;
        numero.push(bingo);
      }
      var button = function() {
          for(var i = 0; i < bingo.length ;i = i + 1){
            if (adicionarsortiado == bingo){
              alert("Número já sortiado!");
              return;
            }
          }
      }
      botao.onclick = button;
    </script>
  </head>
  <body>
      <input placeholder="escreva aqui......." type="text" id="textin">
      <input type="submit" value="ENVIAR 4 NÚMEROS!" id="enviar">
  </body>
</html>

Eu não entendi muito bem o que aconteceu. Imagem do console erro http://i.imgur.com/29vQCsu.png

eu ainda não terminei o código falta algumas coisas porém eu queria saber como tirar esse erro que não está me ajudando a progredir..

PS; já tentei chamar a função button(); desse modo e mesmo assim continua o erro.

2 respostas
solução!
por Pedro Ávila
| 330.4k xp | 175 posts

Olá Ana, boa noite!

Você deve entender que ao carregar a página, o navegador lê seu arquivo de cima pra baixo. Portanto, quando ele interpretar as suas linhas que contêm getElementById ele não vai encontrar os elementos na página, simplesmente porque ainda não foram renderizados.

Além disso o resto da sua página só vai carregar após a interpretação do seu script, ou seja, caso fosse um site maior e seu script fosse mais complexo, este iria bloquear o carregamento da página até o navegador terminar de interpretar o código. Isso dá uma sensação de lentidão pro usuário.

Por esses dois motivos uma boa prática é manter a tag script antes do fechamento da tag body.

Teste:

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>BINGO! Á</title>

</head>

<body>
    <input placeholder="escreva aqui......." type="text" id="textin">
    <input type="submit" value="ENVIAR 4 NÚMEROS!" id="enviar">

    <script>
        var caixadetexto = document.getElementById("textin");
        var botao = document.getElementById("enviar");
        var bingo = [];
        var adicionarsortiado = function() {
            var numero = caixadetexto.value;
            numero.push(bingo);
        }
        var button = function() {
            for (var i = 0; i < bingo.length; i = i + 1) {
                if (adicionarsortiado == bingo) {
                    alert("Número já sortiado!");
                    return;
                }
            }
        }
        botao.onclick = button;
    </script>
</body>

</html>

Você pode testar no seu código anterior, após declarar e inicializar as variáveis caixadetexto e botao, adicione:

console.log(caixadetexto);
console.log(botao)

O console imprimirá null duas vezes, isto porque a variável não recebeu nenhum valor por não ter encontrado os elementos que você indicou.

por Ana Paula Jesus Batista
| 67.2k xp | 27 posts
Estudante

Consegui resolver o problema valeu :) Já o resto do código eu arrumo sozinho.