Tutorial JavaScript Part3

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.