quarta-feira, 2 de maio de 2007

Ola Mundo - Primeiro contato

Dentro do HTMLKIT ou do seu editor de codigo fonte, crie um novo arquivo HTML (ele automaticamente cria as tags principais), temos que referenciar sempre a jQuery.js no arquivo HTML que estamos programando, para isso dentro da tag <head></head>, coloque:

<script type="text/javascript" src="jquery.js"></script>

Para executar qualquer comando após o carregamento do arquivo HTML, quer dizer, depois de ler tag </html>, carregar os arquivos de scripts e CSS, nos utlizamos do atributo onload dentro da tag <body>

<body onload='função' > </script>

Assim, após a identificação pelo browser do carregamento e estar pronto para ser exibido o HTML, ele verifica se onload existe e executa as funções ou função.

Encontrei na internet, a função JAVASCRIPT SETTIMEOUT ,que ficava verificando de tempo em tempo se determinado objeto já tinha sido carregado, em seguida processava a função desejada, adotei isso nos meus scripts, porque ia adiantando as configurações e ajustes necessarios para mostrar a pagina e só mostrava realmente quando tinha a certeza que os principais objetos estavam carregados.

Na jQuery, a coisa funciona parecida com o SETTIMEOUT, ele já vai processando as funções desejadas que vocë programou, antes mesmo do total carregamento da pagina. Leia artigo aqui

Utilize para isso, o comando:


$(document).ready( function{});
Sintaxe:
  • $() : utilizado em todas as funções que devem ser referenciadas a jQuery
  • document : expressão que indica o documento HTML
  • ready() : associado a leitura do documento enquanto está sendo carregado
  • function{} : dentro das chaves {}, colocar os comandos javascript ou jQuery que serão interpretados pelo browser (isso mesmo o browser é um interpretador de comandos)

Na verdade, até que não é difícil entender, a instrução $() referencia as funções jQuery, as expressões, marcadores, id, etc. dentro da $(), no exemplo document, vai ser analisada e interpretada pela jQuery, que em seguida atribui uma propriedade/função jQuery (ready) para executar uma determinada função criada pelo usuário.

Vamos a um exemplo completo:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>APRENDENDO jQuery</title>
<meta http-equiv=
"Content-Type" content="text/html; charset=iso-8859-1">
<script type=
"text/javascript" src="jquery.js"></script>
<script language=
"JavaScript" type="text/javascript">
$
(document).ready(function() {
alert("Ola Mundo");
}
)
//-->
</script>
</head>
<body>
</body>
</html
>

Copie o codigo acima e cole dentro do HTMLKIT, salve o arquivo na pasta onde esta a jQuery.js e execute para ver o resultado.

A mensagem OLA MUNDO, será mostrada.

t+



Um comentário:

Leo Baiano disse...

Estou começando a estudar Jquery agora e a cada dia fico mais fascinado com as possiblidades. Hoje mesmo publiquei em meu blog (www.blog.ljunior.com) um texto com meu primeiro script em jquery. Foi só um teste mas já deu pra ver o poder do framework.