JavaScripts em HTML deve ser inserido entre
<script> e </ script> tags.
JavaScripts pode ser colocado no <body> e na seção <head> de uma página HTML.
O Tag <script>
Para inserir um JavaScript em uma página HTML, use a tag <script>.
O <script> e </ script> diz que o JavaScript começa e termina.
As linhas entre o <script> e </ script> conter o JavaScript:
<script>
alert("My First JavaScript");
</script>
Você não tem que entender o código acima. Basta levá-la para um fato, que o navegador irá interpretar e executar o código JavaScript entre o <script> e </ script> tags.
*Exemplos de idade podem ter type = "text / javascript" no tag <script>. Isso não é mais necessário. JavaScript é a linguagem de script padrão em todos os navegadores modernos e em HTML5.
JavaScript em <body>
Neste exemplo, JavaScript escreve no <body> HTML enquanto a página carrega:
Ex:
<!DOCTYPE html>
<html>
<body>
<p>
JavaScript can write directly into the HTML output stream:
</p>
<script>
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph.</p>");
</script>
<p>
You can only use <strong>document.write</strong> in the HTML output.
If you use it after the document has loaded (e.g. in a function), the whole document will be overwritten.
</p>
</body>
</html>
As funções de JavaScript e Eventos
As instruções JavaScript, no exemplo acima, são executados enquanto a página é carregada.
Mais frequentemente, queremos executar código quando um evento ocorre, como quando o usuário clica em um botão.
Se colocar o código JavaScript dentro de uma função , podemos chamar essa função quando ocorre um evento.
Você vai aprender muito mais sobre as funções de JavaScript e eventos em capítulos posteriores.
JavaScript em <head> ou <body>
Você pode colocar um número ilimitado de scripts em um documento HTML.
Scripts podem ser na <body> ou na seção <head> de HTML, e / ou em ambos.
É uma prática comum a colocar na secção de funções <head>, ou na parte inferior da página. Dessa forma, eles estão todos em um só lugar e não interferem com o conteúdo da página.
A função JavaScript em <head>
Neste exemplo, uma função JavaScript é colocada na secção <head> de uma página HTML.
A função é chamada quando um botão é clicado:
Ex:
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script>
</head>
<body>
<h1>My Web Page</h1>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="myFunction()">Try it</button>
</body>
</html>
A função JavaScript em <body>
Neste exemplo, uma função JavaScript é colocada na secção <body> de uma página HTML.
A função é chamada quando um botão é clicado:
Ex:
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="myFunction()">Try it</button>
<script>
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script>
</body>
</html>
JavaScripts externos
Scripts também pode ser colocado em ficheiros externos. Arquivos externos, muitas vezes contêm o código para ser usado por várias páginas da web diferentes.
Arquivos JavaScript externos têm a extensão de arquivo. Js.
Para usar um script externo, aponte para o arquivo js no "src" atributo da tag <script>.:
Ex:
<!DOCTYPE html>
<html>
<body>
<h1>My Web Page</h1>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="myFunction()">Try it</button>
<p><strong>Note:</strong> myFunction is stored in an external file called "myScript.js".</p>
<script src="myScript.js"></script>
</body>
</html>
Você pode colocar o script no <head> ou <body> como você gosta. O script irá se comportar como se estivesse localizado exatamente onde você colocou a tag <script> no documento.
*Scripts externos não pode conter marcas <script>.
JavaScript é normalmente usado para manipular elementos HTML.
Manipular elementos HTML
Para acessar um elemento HTML JavaScript, você pode usar o document.getElementById ( id método).
Use o atributo "id" para identificar o elemento HTML:
Exemplo
Acesse o elemento HTML com o especificado id e alterar o seu conteúdo:
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p id="demo">My First Paragraph.</p>
<script>
document.getElementById("demo").innerHTML="My First JavaScript";
</script>
</body>
</html>
O JavaScript é executado pelo navegador da web. Neste caso, o navegador irá acessar o elemento HTML com o id = "demo", e substituir seu conteúdo (innerHTML) com "My First JavaScript".
Escrevendo para a saída de documentos
O exemplo abaixo escreve um elemento <p> diretamente na produção de documentos HTML:
Ex:
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<script>
document.write("<p>My First JavaScript</p>");
</script>
</body>
</html>
Aviso
Use document.write () apenas para escrever diretamente na produção de documentos.
Se você executar document.write após o documento foi carregado, toda a página HTML será substituído:
Ex:
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My First Paragraph.</p>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction()
{
document.write("Oops! The document disappeared!");
}
</script>
</body>
</html>
JavaScript no Windows 8
*Microsoft suporta JavaScript para a criação de aplicativos do Windows 8.
JavaScript é definitivamente o futuro, tanto para a Internet e Windows.