>> 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.