Hoje em dia está cada vez mais fácil encontrar páginas Web recheadas de AJAX, que de uma forma geral serve pra você manipular dados da página sem que esta precise ser recarregada novamente. Um dos truques para que isso funcione é a a função innerHTML que executa uma troca de conteúdo em uma tag “div” especificada. É bastante simples de fazer e fica bem legal o resultado, veja como é simples.
A linguagem de hoje é:
javascript
Dados técnicos:
versão do Javascript – 1.8
Navegador testado – Firefox 3.0
Fazendo a Mágica acontecer
Copie o código abaixo e salve em formato .html, abra no navegador e clique no botão.
<html>
<head>
<script>
function trocaFrase(){
var fraseAtual = document.getElementById(“frase”);
fraseAtual.innerHTML = “Funcionou, a frase Mudou!”;
return false;
}
</script>
</head>
<body>
<table border=”0″>
<tr>
<div id=”frase”>Clique para Trocar a Frase</div>
</tr>
<tr>
<input type=”submit” value=”Mudar” onclick=”trocaFrase()”>
</tr>
</table>
</body>
</html>
Conciderações finais
O que achou? Bacana não é, conseguiu pensar de várias utilizações para essa funçãozinha? Muito bem, este é primeiro passo com um exemplo bem simples que pode ser incrementado co diversas outras funções do Javascript. Dê asas a sua imaginação, e boa codificação (Que frase mais edificante, não achou?)
Gostou desse post? Então você vai gostar deste:
Dica de Programação – Criando Scripts com Parâmetros em Perl
Dica de Programação – Fazendo Insert de BLOB com Perl no MySQL
Teste a Portabilidade dos seus scripts
Quer ter estes botões no seu site? Acesse
Julho 31, 2009 às 5:35 pm |
interessante, super util mesmo emm
valws caraa!!
ateh+ bro