Exemplos de propriedades de document

Vemos vários exemplos de acesso e manipulação das propriedades do objeto document de Javascript.

Por Miguel Angel Alvarez - Tradução de JML


Publicado em: 04/4/05
Valorize este artigo:
Depois de estudar as propriedades do objeto document, veremos algum exemplo para ilustrar o modo de acesso e utilização das mesmas.

Exemplo com a propriedade bgColor

Vamos utilizar o evento onclick para colocar três botões na página que ao clicá-los mudará a cor de fundo da página.

<script>
function mudaCor(colorin){
    document.bgColor = colorin
}

</script>
<form>
<input type="Button" value="Vermelho" onclick="mudaCor('ff0000')">
<input type="Button" value="Verde" onclick="mudaCor('00ff00')">
<input type="Button" value="Azul" onclick="mudaCor('0000ff')">
</form>

Primeiro, definimos uma função que será a encarregada de mudar a cor e logo três botões que chamarão a função quando forem clicados passando a cor como parâmetro.

Podemos ver o exemplo em funcionamento.

Propriedade title

A propriedade title salva a cadeia que conforma o título de nossa página web. Se acessarmos a tal propriedade obteremos o título e se a mudamos, mudará o título da página web.

Nota: Lembramos que o título pode ser visto na barra que está acima de tudo da janela do navegador.

Vamos mostrar o título da página em uma caixa de alerta.

alert (document.title)

Agora vamos fazer uma função que modifica o título da página, atribuindo-lhe o texto que chegue por parâmetro.

function mudaTitulo(texto){
    document.title = texto
}

Como no exemplo anterior, vamos criar vários botões que chamem a função passando-lhe distintos textos, que se colocarão no título da página.

<form>
<input type="Button" value="Titulo = Olá a todos" onclick="mudaTitulo('Olá a todos')">
<input type="Button" value="Titulo = Bem-vindos a minha página web" onclick="mudaTitulo('Bem-vindos a minha página web')">
<input type="Button" value="Titulo = Mais dias que trabalhamos" onclick="mudaTitulo('Mais dias que trabalhamos')">
</form>

Podemos ver em funcionamento este script em outra página web.





Comentários do artigo
Foram enviados 3 comentários ao artigo
3 comentários não revisados
0 comentários revisados

Usuários :    login / registro

Manuais relacionados
Categorias relacionadas
O autor

Home | Sobre nós | Copyright | Anuncie | Entrar em contato