Manual completo javascript

INTRODUÇÃO A LINGUAGEM JAVASCRIPT

Desenvolvida pela NETSCAPE, a linguagem JavaScript foi criada para trabalhar

com aplicações interativas nas páginas HTML. Esta linguagem teve sua

primeira versão desenvolvida para o browser Netscape Navigator 2.0 e em

seguida, atribuído também ao Internet Explorer 3.0. A princípio, chamado

de LiveScript, a Netscape após o sucesso inicial desta linguagem, recebe uma

colaboração considerável da Sun Microsystems, empresa que há longo tempo

vem se dedicando ao desenvolvimento de aplicações para a Internet, como

talvez a linguagem mais poderosa da rede, o Java, uma linguagem que requer

um profundo conhecimento de programação e de seu kit de desenvolvimento,

bem diferente do JavaScript que não necessita de tanto. Após esta

colaboração, podemos dizer que o JavaScript é uma linguagem compatível

com a linguagem Java, por esta razão, a semelhança dos nomes

“JavaScript”.

Conhecida também como uma extensão da linguagem HTML (Linguagem de

Marcação de Hipertexto), os comandos JavaScript são embutidos nas páginas

HTML e interpretados pelo Browser, ou seja, o JavaScript não possui nenhum

procedimento de compilação.

JAVA E JAVASCRIPT

Mesmo sendo uma extensão da linguagem HTML, o JavaScript é uma

linguagem baseada na linguagem Java. Com isto, o JavaScript suporta a maior

parte das sintaxes e comandos da linguagem Java.

A linguagem Java é usada na criação de objetos e os chamados Applets

(aplicativos que são executados em uma página da Internet). Já a linguagem

JavaScript, é usada normalmente pelos programadores que fazem uso da

linguagem HTML para controlar dinamicamente o comportamento de objetos

nas páginas.

À única limitação da linguagem JavaScript é que ela suporta poucos tipos de

dados, e implementa apenas alguns conceitos de orientação a objetos, ao

contrário da linguagem Java.

VBSCRIPT E JAVASCRIPT

Para não ficar com uma tecnologia terceirizada, a MICROSOFT desenvolveu

uma linguagem de scripts similar ao JavaScript denominada VBScript. Uma

extensão da conhecida linguagem Visual Basic. A NETSCAPE por sua vez, não

implementou esta linguagem em seu Browser, impedindo-o qualquer script que

seja desenvolvido na linguagem VBScript de ser executado em seu Browser.

AS VERSÕES DO JAVASCRIPT

Atualmente a versão utilizada do JavaScript é a 1.5 que é suportada pelo

Netscape 6.0 e Internet Explorer 5.5, que contém todos os comandos da

linguagem JavaScript.

Observe pela tabela a seguir, a relação das versões existentes do JavaScript e

a sua aceitação pelos navegadores mais utilizados:

Versão do JAVASCRIPT: SUPORTADA PELO:

1.0 Netscape 2.0 / Explorer 3.0

1.1 Netscape 3.0 / Explorer 4.0

1.2 Netscape 4.0 e 4.5 / Explorer 4.0

1.3 Netscape 4.6 e 4.7 / Explorer 5.0

1.4 Internet Explorer 5

1.5 Netscape 6.0 / Explorer 5.5

A linguagem JavaScript assim como a linguagem HTML é submetida à uma

norma internacional, o ECMA que originou a especificação ECMA-262, que

determina o padrão para a linguagem JavaScript, também conhecida como

ECMAScript.

COMPATIBILIDADE ENTRE BROWSER’S

É importante que o usuário evite usar comandos JavaScript que foram

inseridos nas últimas versões, a não ser que o usuário saiba anteriormente

qual o browser são executados. É claro que existem maneiras que garantem

que um determinado comando do JavaScript só seja executado em

determinado browser, facilitando ainda mais que suas páginas sejam

compatíveis com diversas versões de browsers.

Os comandos mais utilizados dentro da linguagem JavaScript são os que fazem

parte da sua primeira versão, já aqueles que fazem o tratamento de objetos

irão variar de acordo com sua versão.

GUIA DE REFERÊNCIA NA INTERNET

A NETSCAPE, possui um enorme guia para o JavaScript na Internet. Para ter

acesso a este guia basta acessar o seguinte endereço:

http://developer.netscape.com/ (em inglês)

ORIENTAÇÃO A OBJETOS

Diferente da Linguagem HTML, a linguagem JavaScript corresponde a

programação orientada a objetos, isto significa que todos os elementos de uma

página da Web são tratados como objetos. Estes objetos são agrupados de

acordo com seu tipo ou finalidade. Dentro da linguagem JavaScript, são

criados automaticamente objetos que permitem que o usuário possa criar

novos objetos de acordo com sua conveniência. Ao ser carregada uma página

da Web, é criado um determinado número de objetos JavaScript, com

propriedades e valores próprios que são ajustados pelo conteúdo da própria

página. Todos eles seguem uma hierarquia que reflete toda a estrutura de uma

página HMTL. A linguagem JavaScript pode ser utilizada para a criação de

scripts tanto do lado cliente como do lado servidor. Seguindo a hierarquia de

objetos da linguagem JavaScript, são criados os seguintes objetos ao ser

carregada uma página:

window: O objecto mais acima na hierarquia, contém propriedades que se

aplicam a toda a janela. Há também um objecto desta classe para todas as

"sub-janelas" de um documento com frames

location: Contém as propriedades da URL actual.

history: Contém as propriedades das URLs visitadas anteriormente.

document: Contém as propriedades do documento contido na janela, tais

como o seu conteúdo, título, cores, etc

ANOTAÇÕES:

______________________________________________________

MANIPULAÇÃO DE OBJETO

A linguagem JavaScript manipula vários tipos de objetos através do uso de

suas propriedades e métodos. Estes objetos são representados por uma

hierarquia, fazendo com que alguns objetos se tornem propriedades de outros,

observe pelo exemplo da figura a seguir esta hierarquia formada:

Hierarquia dos Objetos do JavaScript

Conforme visto no organograma apresentado, observe que existem vários

objetos e muitos deles pertencem à outros, sendo chamados então de

propriedades. Veja pelo exemplo do objeto FORM que possui diversas

propriedades, sendo este objeto também uma propriedade do objeto

DOCUMENT.

BROWSER (navegador)

Math Date

Window/

Frame

Navigator

String

Document

Link Form Anchor

Select

Button

Submit

Text

TextArea

Radio Checkbox

PROPRIEDADES DE OBJETOS

Cada objeto existente na manipulação do JavaScript possuem propriedades

(características). Exemplo, sabemos que um documento HTML possuem título

e corpo, estas características do documento podemos chamar de propriedades

que existem neste documento.

Estas propriedades existem de dois tipos, algumas são os objetos

propriamente ditos enquanto outras não. Um exemplo disto, é o objeto form

(formulário) que é uma propriedade do objeto document (documento),

conforme mostrado no organograma apresentado anteriormente. Já a

propriedade de título da página (title), é pertencente ao objeto document não

havendo nenhuma propriedade sobre ela. Concluindo, podemos dizer que a

propriedade form do objeto document é um objeto-filho e o objeto

document é o objeto-pai. Em geral, as propriedades podem conter valores

(string, números, entre outros tipos). A utilização de propriedades se dá

acompanhada de seu objeto sendo separados por um ponto apenas. Veja

abaixo a sintaxe de utilização de propriedades:

nomeObjeto.propriedade

MÉTODOS DE OBJETOS

Além das propriedades, os objetos podem conter métodos que são funções

pré-definidas pela linguagem JavaScript que irão executar determinada

operação. Por exemplo dentro de um documento o usuário poderá utilizar o

método de escrever neste documento para exibir um texto qualquer. Os

métodos estarão sempre associados à algum objeto presente no documento e

cada método faz parte de um objeto específico. Não tente usar métodos em

objetos que não o utilizam, isto faz com que a linguagem JavaScript cause erro

na execução do script. Na maioria das vezes os métodos são usados para

alterar o valor de uma propriedade ou executar uma tarefa específica. Veja a

sintaxe de utilização dos métodos:

nomeObjeto.método(argumento)

Na sintaxe apresentada, nomeObjeto faz referência ao objeto a ser utilizado e

o qual sofrerá uma ação do método, já método é o nome de identificação do

método usado e entre parênteses (argumento) é a expressão ou valor

opcional que será usada para alterar sobre o objeto.

EVENTOS

Em linguagens orientadas a objetos é comum a manipulação de eventos que é

qualquer reação ou ação que executará determinado procedimento,

normalmente ocorre por ato executado pelo usuário, como clicar em um botão,

selecionar algum objeto e até mesmo pressionar alguma tecla. Resumindo

EVENTOS são quaisquer ações iniciadas por parte do usuário.

Sua utilização se dá como atributos da linguagem HTML, ou seja dentro dos

próprios Tag’s HTML. Sua sintaxe tem a seguinte formação:

Onde é apresentado TAG é uma instrução da linguagem HTML.

Onde é evento é o nome do evento gerado da linguagem JavaScript.

Onde “Instruções JavaScript” serão as instruções JavaScript à serem

executadas. Elas estarão sempre entre aspas.

Caso haja mais de um comando JavaScript a ser executado para o mesmo

evento estes deverão estar separados por ponto e vírgula (;), conforme

mostrado no exemplo a seguir:

MANIPULADORES DE EVENTOS UTILIZADOS

EVENTO MANIPULADOR DESCRIÇÃO

blur onBlur

Ocorre quando o usuário

retira o foco de um objeto

de formulário.

change onChange

Ocorre quando o usuário

muda o valor de um objeto

de formulário.

click onClick

Ocorre quando o usuário

clica sobre o objeto.

focus onFocus

Ocorre quando o usuário

focaliza o objeto.

load onLoad

Ocorre quando o usuário

carrega a página.

unload onUnload

Ocorre quando o usuário

abandona a página.

mouseOver onMouseOver

Ocorre quando o ponteiro

do mouse passa sobre um

link ou âncora. Válidos

apenas para hiperlinks.

select onSelect

Ocorre quando o usuário

seleciona um elemento de

um formulário.

EVENTO MANIPULADOR DESCRIÇÃO

submit onSubmit

Ocorre quando o usuário

envia um formulário.

mouseDown onMouseDown

Ocorre quando o botão do

mouse é pressionado.

mouseMove onMouseMove

Ocorre quando o ponteiro

do mouse se movimenta

sobre o objeto.

mouseOut onMouseOut

Ocorre quando o ponteiro

do mouse afasta de um

objeto. Válidos apenas

para hiperlinks.

mouseUp onMouseUp

Ocorre quando o botão do

mouse é solto.

keyDown onKeyDown

Ocorre quando uma tecla é

segurada.

keyPress onKeyPress

Ocorre quando uma tecla é

pressionada.

keyUp onKeyUp

Ocorre quando uma tecla é

solta.

Vejamos a utilização dos eventos dentro de alguns TAG’s HTML, sem a

necessidade de criarmos rotinas separadas para os mesmos. Vejamos o

exemplo a seguir:

<HTML>

<HEAD>

<TITLE>Manipuladores de Eventos</TITLE>

</HEAD>

No exemplo apresentado anteriormente, foi usado o evento onLoad que

ocorre quando a página é carregada. Neste evendo foi usada a instrução

defaultStatus que exibe a mensagem SEJA BEM VINDO!!! na barra de

status do navegador.

Outro exemplo que pode ser aplicado através de um evento, é utilizar o evento

onUnLoad que executará alguma ação quando o usuário sair de sua página,

baseado no exemplo anterior, inclua no corpo de sua página <BODY> a

seguinte linha abaixo:

<BODY onLoad="defaultStatus=('Seja Bem Vindo!!!')"

onUnLoad="alert('Obrigado pela Visita')">

Neste exemplo, o evento onUnLoad, faz com que se o usuário abandonar esta

página seja entrando em outra, acessando hiperlinks ou até mesmo fechando o

browser, é execute a instrução alert() que tem a função de exibir uma caixa

de diálogo do Windows com a mensagem definida, permitindo ao usuário,

pressionar o botão de OK para encerra-la.

ANOTAÇÕES:

______________________________________________________

ELEMENTOS DA LINGUAGEM

O JavaScript pode ser diferente em alguns aspectos de outras linguagens, mas

nem por isso não deixa de ser uma linguagem de programação, com isto veja

os elementos existentes dentro da linguagem.

VARIÁVEIS

Assim como as propriedades que armazenam dados sobre os objetos, é

possível com JavaScript a utilização das variáveis que têm a finalidade de

armazenar temporariamente informações como textos, valores, datas, entre

outros.

O conteúdo de uma variável pode ser simplesmente atribuído ou vir de um

resultado de uma ação dada de uma expressão ou função. Veja alguns

exemplos.

nome=“ADRIANO LIMA”

idade=“25”

Soma=2002-25

tempo=Date()

NOMES DE VARIÁVEIS

O nome de uma variável poderá iniciar-se com uma letra ou através do

caractere “underscore” seguido de letras ou números. Outra semelhança do

JavaScript com outras linguagens é a diferenciação de de letras minúsculas e

maiúsculas. Veja alguns nomes válidos para variáveis:

nome _senac escola

Na linguagem JavaScript existem dois tipos de variáveis que são:

GLOBAIS usadas em qualquer parte de uma aplicação.

LOCAIS usadas somente na rotina que foi desenvolvida.

Para criar variáveis locais, é necessário que o usuário utilize a palavra-chave

var. Veja a declaração de uma variável local:

var nome=“ADRIANO LIMA”

var soma=2002-25

As variáveis definidas fora de uma função sempre estão disponíveis para todas

as funções dentro do script que estão na mesma página. Estas variáveis são

referenciadas como variáveis globais. As variáveis que são definidas dentro de

função, também são globais, desde que não seja utilizado a instrução var em

sua declaração.

Caso o usuário declare uma variável dentro de uma função através da

instrução var, esta variável passa a ser apenas local, ou seja, são utilizadas

apenas para aquela função onde foi declarada.

É bom saber que, as variáveis globais ficam na memória mesmo após a

execução do script, estas variáveis somente são liberadas da memória quando

o documento é descarregado.

As variáveis podem ser declaradas também separadas por vírgula, da seguinte

maneira:

var nome, endereco, telefone;

var nome;

var endereco;

var telefone;

Outro exemplo prático de atribuição, é atribuir um mesmo valor a mais de

uma variável, da seguinte maneira:

var campo1 = campo2 = campo3 = 5

No exemplo anterior, foi atribuído o número 5 nas variáveis campo1, campo2

e campo3.

Veja pelo exemplo do código abaixo como manipular variáveis através da

linguagem JavaScript:

<HTML>

<HEAD>

<TITLE>CÁLCULOS</TITLE>

</HEAD>

<BODY>

valor=30

document.write("Resultado do cálculo ",(10*2)+valor)

</script>

CONTINUE >>>

E-BOOKOASIS

Pesquisar este blog

Manual completo javascript - PARTE 2

Comentários

Postar um comentário