Exemplos Comuns de JavaScript

Esta página contém alguns exemplos do que o JavaScript pode fazer.

Atenção:Se esses exemplos usarem métodos que você ainda não estudou:Por favorNão se preocupe. Você aprenderá sobre eles no próximo capítulo.

JavaScript pode modificar o conteúdo HTML

O método getElementById() retorna o elemento cujo ID coincide com o valor especificado.

Este exemplo usa este método para encontrar o elemento HTML (id="para") e alterar o conteúdo do elemento (innerHTML) para "Hello world":

document.getElementById("para").innerHTML = "Hello world";

JavaScript pode alterar o valor da propriedade HTML

Neste exemplo, o JavaScript alterou<img>do rótulosrcO valor da propriedade:

JavaScript pode alterar o estilo HTML (CSS)

JavaScript styleA propriedade pode ser usada para definir o estilo inline do elemento.

document.getElementById("demo").style.color = "blue";

JavaScript pode ocultar elementos HTML

Ocultar elementos HTML pode ser feito alterando o estilo de exibição.

document.getElementById("demo").style.display = "none";

JavaScript pode exibir elementos HTML

Mostrar elementos HTML ocultos pode ser feito alterando o estilo de exibição.

document.getElementById("demo").style.display = "block";

JavaScript pode criar janelas de alerta pop-up

Neste exemplo, o JavaScript cria uma caixa de diálogo de alerta.

alert("Hello world!");

JavaScript pode adicionar um manipulador de evento ao documento

Neste exemplo, o JavaScript monitora o evento de clique do mouse e reage a ele.

document.addEventListener("click", myFunc);
function myFunc() {
　　　document.body.style.backgroundColor = "coral";
}

JavaScript pode exibir o tempo

Neste exemplo, o JavaScript exibe o tempo atual.

var intervalID = setInterval(startTimer,　1000);
function startTimer() {
　　　　var date = new Date();
　　　　var x = document.getElementById("result");
　　　　x.innerHTML = date.getHours()　+　":"　+　date.getMinutes()　+　":"　+　date.getSeconds();
}