COLUNA 1: Agora nesse último exemplo, recordar que nós intercalados alguns O código JavaScript dentro do meu HTML, especificamente, dentro do valor de o atributo chamado On Enviar para esse tag form. Agora para pequenas páginas, este não é um negócio tão grande. Mas, como uma página web fica mais e mais complexa, simplesmente colocando o seu O código JavaScript aqui e lá dentro do valor de atributos não é o melhor design. Melhor se levarmos isso e pelo menos colocá-lo dentro de a tag script central. Como fazer isso? Bem, vamos voltar à minha forma e tag primeiro excluir este atributo e seu valorizar completamente. Então, aqui em cima, ao invés de definir um função chamada Greet, vamos pendurar para a linha de código que em última análise, ainda vai querer executar e substituir a função Greet como se segue. Document.get elemento por ID citar demonstração unquote - onde demo, recall, é o único identificador para o próprio formulário - ponto em enviar, o que lembro é o nome do manipulador de eventos em que estamos interessados. E vamos atribuir esse em enviar manipulador o valor que é realmente um funcionar em si. Agora note que eu não sou realmente chamar uma função aqui. Estou em vez definindo um anônimo, de outro modo conhecida como uma função lambda, especificando entre essas chaves um monte de código que deveria na verdade, ser executado. Especificamente, o código que eu gostaria para executar é que a linha que eu tinha antes, e, em seguida, vamos adicionar a isso return false para que essa forma não é em última análise, acabam submetidos a web remoto servidor da maneira tradicional. Vamos agora salvar o arquivo, abra-se em um navegador, e ver o que acontece. http://localhost/dom-1.html. Vamos agora escrever em meu nome, David, em Enviar. E nada parece ter acontecido exceto o URL da minha página parece mudaram a forma como se foi realmente submetidos ao mesmo arquivo. Agora, por que pode ser isso? Bem, eu preciso de mais informações. Então, vamos em frente e abrir Chrome Ferramentas de Desenvolvimento para que eu possa realmente olhar para a janela do console para ver se eu tivesse feito algo errado. Eu posso acessar essa via um par de formas. Uma delas é através deste menu aqui, em seguida, em Ferramentas, em seguida, para baixo para Ferramentas de Desenvolvimento. E note aqui na guia Console, há um erro de tipo não capturada, não pode definir a propriedade em enviar nulo. Agora, por que pode ser isso? Bem de volta no meu código fonte aqui, aviso que em Submit Eu acho que é uma propriedade do elemento cujo identificador único é demonstração. Um elemento, de novo, é apenas um nó em uma árvore. Assim, parece que o meu computador não faz acha que esse elemento ou nó existe ainda. E, de fato, isso não acontece. Lembre-se que uma página da web é analisado ou ler por um navegador web, de cima para baixo, esquerda para a direita. E assim, quando o código JavaScript é encontrado, normalmente, é executada imediatamente. Mas, neste caso, não temos sequer chegado Ainda que a parte do dom, o HTML, em que esse formulário com um único demonstração identificador foi declarado. E assim estamos tentando executar o meu O código JavaScript que antes mesmo nó existe na árvore que, é claro, é problemático porque então, com certeza, o próprio elemento será nulo naquele momento. Então, como resolver? Bem, temos um par de soluções. Mas vamos tentar o mais simples realocando minha tag script da cabeça marcar para o meu corpo, mas especificamente, na direção a parte inferior do corpo da minha página, para que é abaixo dos nós e perguntas. Especificamente, vamos destacar e cortar a tag abrir e fechar tag para o script e realocar todo esse bloco de código para a parte inferior do arquivo aqui. Agora, isso não é necessariamente o mais limpo projetar, mas pelo menos ele vai fazer cumprir a ordem correta das operações. Vamos salvar o arquivo e recarregar no meu navegador. Vamos recarregar a página, re-entrada de meu nome, e ali, Olá David está de volta.