Hoje vamos começar uma série de posts sobre programação em Javascript. Vamos criar desde códigos simples até alguns códigos mais avançados, e ainda apresentar diversas ferramentas úteis para um desenvolvedor Web. Mas como é de costume em qualquer curso, vamos começar com a teoria.
Javascript é uma linguagem interpretada (isto é, não precisa ser compilada e gerar um arquivo binário para que possa ser testada) voltada para a Web. Embora existam aplicações no lado do servidor, seu uso é mais comum no lado cliente, ou seja, no navegador do usuário, pois permite a criação de uma página dinâmica. O Javascript pode ser utilizado desde códigos simples para validação de um formulário, por exemplo, até aplicações complexas desenvolvidas com centenas de milhares de linhas de código.
Vamos começar com o básico: como incluir Javascript em minha página HTML? (esse curso supõe que você tenha pelo menos um conhecimento básico de HTML)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <html> <head> <title>Curso de Javascript do Blog infognosis</title> <!-- podemos incluir um arquivo externo assim: --> <script src="javascript.js" type="text/javascript"></script> </head> <body> <!-- ou inserir o código no meio do arquivo assim: --> <script type="text/javascript"> alert("Curso de Javascript do Blog Infognosis!"); </script> </body></html> |
Pronto, você já tem seu código Javascript rodando. Mas sem fazer nada. Agora vamos ver alguma coisa um pouco mais útil, pegar o valor de um campo de texto digitado pelo usuário e exibi-lo:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <html> <head> <title>Curso de Javascript do Blog Infognosis</title> </head> <body> <!-- Nosso código Javascript --> <script type="text/javascript"> function formSubmit() { var nome = document.getElementById("nome").value(); alert("Olá " + nome + "! Bem-vindo ao Blog Infognosis!"); } </script> <!-- vamos criar um formulário com um campo de texto e um botão --> <form id="formulario" onsubmit="formSubmit()"> <label for="nome">Digite seu nome: </label> <input type="text" id="nome" /> <input type="submit" id="submit" text="Enviar" /> </form> </body></html> |
Postar um comentário