manual completo javascript

235
JavaScript – Aplicações Interativas para a Web ADRIANO GOMES LIMA BELO HORIZONTE 2006

Upload: hector

Post on 06-Nov-2015

44 views

Category:

Documents


0 download

DESCRIPTION

novo manual para java

TRANSCRIPT

  • JavaScript Aplicaes Interativas para a Web

    ADRIANO GOMES LIMA

    BELO HORIZONTE 2006

  • INTRODUO A LINGUAGEM JAVASCRIPT............................................9

    JAVA E JAVASCRIPT .............................................................................. 9

    VBSCRIPT E JAVASCRIPT..................................................................... 10

    AS VERSES DO JAVASCRIPT .............................................................. 10

    COMPATIBILIDADE ENTRE BROWSERS ................................................. 11

    GUIA DE REFERNCIA NA INTERNET..................................................... 11

    ORIENTAO A OBJETOS .................................................................... 11

    MANIPULAO DE OBJETO .................................................................. 13

    PROPRIEDADES DE OBJETOS ............................................................... 14

    MTODOS DE OBJETOS....................................................................... 14

    EVENTOS........................................................................................... 15

    MANIPULADORES DE EVENTOS UTILIZADOS.......................................... 16

    VARIVEIS ........................................................................................ 19

    NOMES DE VARIVEIS ........................................................................ 19

    LITERAIS........................................................................................... 22

    INTEIROS (INTEGER) .......................................................................... 23

    PONTO FLUTUANTE............................................................................. 23

    BOOLEANOS ...................................................................................... 23

    LITERAIS STRING............................................................................... 23

    CARACTERES ESPECIAIS ..................................................................... 24

    EXPRESSES ..................................................................................... 24

    OPERADORES..................................................................................... 25

    OPERADORES DE INCREMENTO E DECREMENTO .................................... 26

    OPERADORES RELACIONAIS ................................................................ 28

    OPERADORES RELACIONAIS ................................................................ 28

    OPERADORES LGICOS....................................................................... 28

    OPERADOR DE CONCATENAO DE STRING .......................................... 29

    DECLARAES ....................................................................................30

    OPERADOR NEW................................................................................. 30

    PALAVRA-CHAVE THIS......................................................................... 30

    BREAK............................................................................................... 30

  • UTILIZAO DE COMENTRIOS............................................................ 31

    VAR .................................................................................................. 32

    DESENVOLVIMENTO DE SCRIPTS........................................................33

    DESENVOLVENDO SCRIPTS COM O TAG ................................ 33

    DESENVOLVENDO SCRIPTS ATRAVS DE UM ARQUIVO EXTERNO............. 34

    NOTIFICAO DE ERROS....................................................................36

    INSTRUES BSICAS .......................................................................38

    MTODO DOCUMENT.WRITE().............................................................. 38

    MTODO ALERT() ............................................................................... 39

    MTODO CONFIRM() ........................................................................... 39

    COMANDOS CONDICIONAIS E REPETIO .........................................41

    INSTRUO WHILE............................................................................. 41

    INSTRUO FOR ................................................................................ 42

    INSTRUO FOR...IN .......................................................................... 43

    IF ... ELSE ......................................................................................... 44

    RETURN............................................................................................. 47

    SWITCH ............................................................................................ 48

    INSTRUO WITH .............................................................................. 49

    OBJETO ARGUMENTS .......................................................................... 54

    UTILIZANDO EVENTOS .......................................................................56

    EVENTO ONBLUR................................................................................ 56

    EVENTO ONCHANGE ........................................................................... 57

    EVENTO ONCLICK............................................................................... 57

    EVENTO ONFOCUS.............................................................................. 57

    EVENTO ONLOAD................................................................................ 58

    EVENTO ONUNLOAD ........................................................................... 58

    EVENTO ONMOUSEOVER ..................................................................... 58

    EVENTO ONMOUSEOUT ....................................................................... 59

    EVENTO ONMOUSEDOWN.................................................................... 60

    EVENTO ONMOUSEUP ......................................................................... 60

    EVENTO ONKEYPRESS......................................................................... 60

  • EVENTO ONKEYDOWN......................................................................... 60

    EVENTO ONKEYUP .............................................................................. 60

    EVENTO ONSELECT............................................................................. 61

    EVENTO ONSUBMIT ............................................................................ 61

    FUNES DA LINGUAGEM JAVASCRIPT ..............................................63

    FUNO EVAL .................................................................................... 63

    FUNO ISNAN .................................................................................. 64

    FUNO PARSEFLOAT ......................................................................... 65

    FUNO PARSEINT ............................................................................. 66

    FUNES PR-PROGRAMADAS ...........................................................68

    IMPRESSO DA PGINA ...................................................................... 68

    ADICIONAR AO FAVORITOS ................................................................. 68

    JANELA EM MOVIMENTO...................................................................... 69

    TEXTO NA BARRA DE STATUS EM MOVIMENTO ...................................... 70

    TABELA DE CORES.............................................................................. 72

    TEXTO EM MOVIMENTO EM UM CAMPO DE FORMULRIO......................... 73

    OBJETOS PR-CONSTRUDOS .............................................................76

    OBJETO DATE .................................................................................... 76

    MTODOS DO OBJETO DATE ................................................................ 77

    OBJETO STRING .................................................................................78

    PROPRIEDADES.................................................................................. 78

    PROPRIEDADES DO OBJETO STRING..................................................... 78

    MTODOS DO OBJETO STRING............................................................. 78

    MTODO ANCHOR............................................................................... 79

    MTODO BIG ..................................................................................... 79

    MTODO SMALL ................................................................................. 80

    MTODO BOLD................................................................................... 80

    MTODO ITALICS ............................................................................... 81

    MTODO FIXED .................................................................................. 81

    MTODO STRIKE ................................................................................ 82

    MTODO FONTCOLOR ......................................................................... 82

  • MTODO FONTSIZE ............................................................................ 83

    MTODO SUB..................................................................................... 83

    MTODO SUP ..................................................................................... 83

    MTODO charAT ................................................................................. 84

    MTODO INDEXOF.............................................................................. 84

    MTODO LASTINDEXOF....................................................................... 85

    MTODO LINK.................................................................................... 86

    MTODO REPLACE .............................................................................. 86

    MTODO SUBSTRING.......................................................................... 87

    MTODO TOLOWERCASE ..................................................................... 88

    MTODO TOUPPERCASE ...................................................................... 88

    OBJETO IMAGE ...................................................................................89

    MTODOS DE INTERFACE COM O USURIO.........................................92

    MTODO ALERT.................................................................................. 92

    MTODO CONFIRM ............................................................................. 93

    MTODO PROMPT ............................................................................... 94

    OBJETO WINDOW...............................................................................96

    PROPRIEDADES DO OBJETO WINDOW/FRAME........................................ 96

    WINDOW.STATUS E DEFAULTSTATUS ................................................... 97

    MTODO OPEN ................................................................................... 97

    MTODO CLOSE ................................................................................. 98

    MTODO SETTIMEOUT ........................................................................ 98

    MTODO CLEARTIMEOUT................................................................... 100

    TRABALHANDO COM JANELAS ..........................................................101

    ABRINDO PGINAS EM FULLSCREEN (Tela Cheia)................................. 110

    O OBJETO MATH ...............................................................................111

    PROPRIEDADES DE CLCULO DO OBJETO MATH................................... 111

    MTODOS DO OBJETO MATH ............................................................. 112

    ABS ................................................................................................ 112

    ACOS .............................................................................................. 112

    ASIN ............................................................................................... 113

  • CEIL................................................................................................ 113

    COS................................................................................................ 114

    EXP................................................................................................. 114

    FLOOR............................................................................................. 114

    LOG ................................................................................................ 115

    MAX................................................................................................ 115

    POW (base,expoente) ....................................................................... 116

    RANDOM ......................................................................................... 116

    ROUND............................................................................................ 117

    SIN................................................................................................. 118

    SQRT .............................................................................................. 118

    TAN ................................................................................................ 118

    OBJETO DATE .................................................................................. 119

    MTODOS GET DO OBJETO DATE ....................................................... 119

    MTODO PARSE E UTC ...................................................................... 121

    MTODOS SET DO OBJETO DATE........................................................ 122

    MTODO TOGMTSCRING ................................................................... 123

    MTODO TOLOCALESTRING............................................................... 123

    EXERCCIOS .................................................................................... 126

    OBJETO DOCUMENT..........................................................................128

    PROPRIEDADES DO OBJETO DOCUMENT ............................................. 128

    MTODOS DO OBJETO DOCUMENT ..................................................... 132

    MTODO CLEAR................................................................................ 132

    MTODO CLOSE ............................................................................... 133

    MTODO WRITE E WRITELN............................................................... 134

    EXERCCIOS .................................................................................... 136

    OBJETO LINK....................................................................................148

    PROPRIEDADES DO OBJETO LINKS..................................................... 148

    UTILIZANDO ARRAYS .......................................................................149

    ARRAY ANCHORS[] ........................................................................... 153

    ARRAY ELEMENTS[] .......................................................................... 154

  • EXERCCIOS: ................................................................................... 157

    MANIPULANDO FRAMES ...................................................................161

    HIERARQUIA FRAMESET WINDOW...................................................... 163

    OBJETO FORM...................................................................................170

    PROPRIEDADES DO OBJETO FORMS.................................................... 170

    MTODOS DO OBJETO FORM ............................................................. 172

    ELEMENTOS DE UM FORMULRIO....................................................... 172

    OBJETO TEXT................................................................................... 173

    MANIPULADORES DE EVENTO PARA FORMULRIOS .............................. 173

    OBJETO PASSWORD.......................................................................... 176

    OBJETO TEXTAREA ........................................................................... 176

    OBJETO BUTTON .............................................................................. 177

    OBJETO SUBMIT............................................................................... 178

    OBJETO RESET................................................................................. 179

    OBJETO CHECKBOX (Caixa de Verificao)........................................... 179

    MANIPULADORES DE EVENTO ............................................................ 181

    OBJETO RADIO................................................................................. 182

    EVITANDO O USO DA TECLA ENTER.................................................... 187

    OBJETO LOCATION ........................................................................... 189

    PROPRIEDADES DO OBJETO LOCATION............................................... 190

    EXERCCIOS .................................................................................... 192

    UTILIZANDO O OBJETO HISTORY ....................................................... 203

    PROPRIEDADE.................................................................................. 203

    MTODOS BACK E FORWARD............................................................. 203

    UTILIZANDO O OBJETO NAVIGATOR ................................................... 205

    UTILIZANDO O OBJETO NAVIGATOR ................................................... 205

    PROPRIEDADES DO OBJETO NAVIGATOR............................................. 205

    ACESSANDO CDIGO-FONTE A PARTIR DE UM LINK............................. 207

    UTILIZANDO COOKIES .....................................................................209

    Criando Cookies ............................................................................... 210

    DEPURAO DE CDIGO ..................................................................219

  • ISOLAMENTO DE PROBLEMAS ............................................................ 219

    ERROS EM TEMPO DE CARREGAMENTO (Load-Time)............................. 220

    ERROS EM TEMPO DE EXECUO (Run-Time) ...................................... 221

    ERROS DE LGICA (Logic Errors) ....................................................... 221

    ERROS COMUNS EXISTENTES ............................................................ 222

    ANALISANDO A ORIGEM DOS ERROS.................................................. 223

    OUTROS ERROS COMUNS.................................................................. 224

    RESUMO GERAL DE OBJETOS JAVASCRIPT .......................................225

    RESUMO GERAL DE MTODOS JAVASCRIPT ......................................228

    MTODOS DO OBJETO DOCUMENT ..................................................... 228

    MTODOS DO OBJETO FORM ............................................................. 228

    MTODOS DO OBJETO DATE .............................................................. 229

    MTODOS DO OBJETO HISTORY......................................................... 231

    MTODOS DO OBJETO MATH ............................................................. 231

    MTODOS DO OBJETO STRING........................................................... 232

    MTODOS DE INTERFACE COM O USURIO ......................................... 234

    MTODOS DO OBJETO WINDOW ........................................................ 234

  • INTRODUO A LINGUAGEM JAVASCRIPTINTRODUO A LINGUAGEM JAVASCRIPTINTRODUO A LINGUAGEM JAVASCRIPTINTRODUO A LINGUAGEM JAVASCRIPT

    Desenvolvida pela NETSCAPE, a linguagem JavaScript foi criada para trabalhar

    com aplicaes interativas nas pginas HTML. Esta linguagem teve sua

    primeira verso desenvolvida para o browser Netscape Navigator 2.0 e em

    seguida, atribudo tambm ao Internet Explorer 3.0. A princpio, chamado

    de LiveScript, a Netscape aps o sucesso inicial desta linguagem, recebe uma

    colaborao considervel da Sun Microsystems, empresa que h longo tempo

    vem se dedicando ao desenvolvimento de aplicaes para a Internet, como

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

    um profundo conhecimento de programao e de seu kit de desenvolvimento,

    bem diferente do JavaScript que no necessita de tanto. Aps esta

    colaborao, podemos dizer que o JavaScript uma linguagem compatvel

    com a linguagem Java, por esta razo, a semelhana dos nomes

    JavaScript.

    Conhecida tambm como uma extenso da linguagem HTML (Linguagem de

    Marcao de Hipertexto), os comandos JavaScript so embutidos nas pginas

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

    procedimento de compilao.

    JAVA E JAVASCRIPT

    Mesmo sendo uma extenso 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 criao de objetos e os chamados Applets

    (aplicativos que so executados em uma pgina da Internet). J a linguagem

    JavaScript, usada normalmente pelos programadores que fazem uso da

  • linguagem HTML para controlar dinamicamente o comportamento de objetos

    nas pginas.

    nica limitao da linguagem JavaScript que ela suporta poucos tipos de

    dados, e implementa apenas alguns conceitos de orientao a objetos, ao

    contrrio da linguagem Java.

    VBSCRIPT E JAVASCRIPT

    Para no ficar com uma tecnologia terceirizada, a MICROSOFT desenvolveu

    uma linguagem de scripts similar ao JavaScript denominada VBScript. Uma

    extenso da conhecida linguagem Visual Basic. A NETSCAPE por sua vez, no

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

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

    AS VERSES DO JAVASCRIPT

    Atualmente a verso utilizada do JavaScript a 1.5 que suportada pelo

    Netscape 6.0 e Internet Explorer 5.5, que contm todos os comandos da

    linguagem JavaScript.

    Observe pela tabela a seguir, a relao das verses existentes do JavaScript e

    a sua aceitao pelos navegadores mais utilizados:

    Verso 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 especificao ECMA-262, que

    determina o padro para a linguagem JavaScript, tambm conhecida como

    ECMAScript.

    COMPATIBILIDADE ENTRE BROWSERS

    importante que o usurio evite usar comandos JavaScript que foram

    inseridos nas ltimas verses, a no ser que o usurio saiba anteriormente

    qual o browser so executados. claro que existem maneiras que garantem

    que um determinado comando do JavaScript s seja executado em

    determinado browser, facilitando ainda mais que suas pginas sejam

    compatveis com diversas verses de browsers.

    Os comandos mais utilizados dentro da linguagem JavaScript so os que fazem

    parte da sua primeira verso, j aqueles que fazem o tratamento de objetos

    iro variar de acordo com sua verso.

    GUIA DE REFERNCIA NA INTERNET

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

    acesso a este guia basta acessar o seguinte endereo:

    http://developer.netscape.com/ (em ingls)

    ORIENTAO A OBJETOS

    Diferente da Linguagem HTML, a linguagem JavaScript corresponde a

    programao orientada a objetos, isto significa que todos os elementos de uma

    pgina da Web so tratados como objetos. Estes objetos so agrupados de

    acordo com seu tipo ou finalidade. Dentro da linguagem JavaScript, so

    criados automaticamente objetos que permitem que o usurio possa criar

    novos objetos de acordo com sua convenincia. Ao ser carregada uma pgina

    da Web, criado um determinado nmero de objetos JavaScript, com

  • propriedades e valores prprios que so ajustados pelo contedo da prpria

    pgina. Todos eles seguem uma hierarquia que reflete toda a estrutura de uma

    pgina HMTL. A linguagem JavaScript pode ser utilizada para a criao de

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

    objetos da linguagem JavaScript, so criados os seguintes objetos ao ser

    carregada uma pgina:

    window: O objecto mais acima na hierarquia, contm propriedades que se

    aplicam a toda a janela. H tambm um objecto desta classe para todas as

    "sub-janelas" de um documento com frames

    location: Contm as propriedades da URL actual.

    history: Contm as propriedades das URLs visitadas anteriormente.

    document: Contm as propriedades do documento contido na janela, tais

    como o seu contedo, ttulo, cores, etc

    ANOTAES:

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

  • MANIPULAO DE OBJETO

    A linguagem JavaScript manipula vrios tipos de objetos atravs do uso de

    suas propriedades e mtodos. Estes objetos so 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 vrios

    objetos e muitos deles pertencem outros, sendo chamados ento de

    propriedades. Veja pelo exemplo do objeto FORM que possui diversas

    propriedades, sendo este objeto tambm uma propriedade do objeto

    DOCUMENT.

    BROWSER (navegador)

    Math Date Window/

    Frame Navigator

    String

    Document

    Form Link Anchor

    Select Button

    Submit

    Text

    TextArea Radio Checkbox

  • PROPRIEDADES DE OBJETOS

    Cada objeto existente na manipulao do JavaScript possuem propriedades

    (caractersticas). Exemplo, sabemos que um documento HTML possuem ttulo

    e corpo, estas caractersticas do documento podemos chamar de propriedades

    que existem neste documento.

    Estas propriedades existem de dois tipos, algumas so os objetos

    propriamente ditos enquanto outras no. Um exemplo disto, o objeto form

    (formulrio) que uma propriedade do objeto document (documento),

    conforme mostrado no organograma apresentado anteriormente. J a

    propriedade de ttulo da pgina (title), pertencente ao objeto document no

    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, nmeros, entre outros tipos). A utilizao de propriedades se d

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

    abaixo a sintaxe de utilizao de propriedades:

    nomeObjeto.propriedade

    MTODOS DE OBJETOS

    Alm das propriedades, os objetos podem conter mtodos que so funes

    pr-definidas pela linguagem JavaScript que iro executar determinada

    operao. Por exemplo dentro de um documento o usurio poder utilizar o

    mtodo de escrever neste documento para exibir um texto qualquer. Os

    mtodos estaro sempre associados algum objeto presente no documento e

    cada mtodo faz parte de um objeto especfico. No tente usar mtodos em

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

    na execuo do script. Na maioria das vezes os mtodos so usados para

  • alterar o valor de uma propriedade ou executar uma tarefa especfica. Veja a

    sintaxe de utilizao dos mtodos:

    nomeObjeto.mtodo(argumento)

    Na sintaxe apresentada, nomeObjeto faz referncia ao objeto a ser utilizado e

    o qual sofrer uma ao do mtodo, j mtodo o nome de identificao do

    mtodo usado e entre parnteses (argumento) a expresso ou valor

    opcional que ser usada para alterar sobre o objeto.

    EVENTOS

    Em linguagens orientadas a objetos comum a manipulao de eventos que

    qualquer reao ou ao que executar determinado procedimento,

    normalmente ocorre por ato executado pelo usurio, como clicar em um boto,

    selecionar algum objeto e at mesmo pressionar alguma tecla. Resumindo

    EVENTOS so quaisquer aes iniciadas por parte do usurio.

    Sua utilizao se d como atributos da linguagem HTML, ou seja dentro dos

    prprios Tags HTML. Sua sintaxe tem a seguinte formao:

    Onde apresentado TAG uma instruo da linguagem HTML.

    Onde evento o nome do evento gerado da linguagem JavaScript.

    Onde Instrues JavaScript sero as instrues JavaScript serem

    executadas. Elas estaro sempre entre aspas.

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

    evento estes devero estar separados por ponto e vrgula (;), conforme

    mostrado no exemplo a seguir:

    MANIPULADORES DE EVENTOS UTILIZADOS

    EVENTO MANIPULADOR DESCRIO

    blur onBlur

    Ocorre quando o usurio

    retira o foco de um objeto

    de formulrio.

    change onChange

    Ocorre quando o usurio

    muda o valor de um objeto

    de formulrio.

    click onClick Ocorre quando o usurio

    clica sobre o objeto.

    focus onFocus Ocorre quando o usurio

    focaliza o objeto.

    load onLoad Ocorre quando o usurio

    carrega a pgina.

    unload onUnload Ocorre quando o usurio

    abandona a pgina.

    mouseOver onMouseOver

    Ocorre quando o ponteiro

    do mouse passa sobre um

    link ou ncora. Vlidos

    apenas para hiperlinks.

    select onSelect

    Ocorre quando o usurio

    seleciona um elemento de

    um formulrio.

  • EVENTO MANIPULADOR DESCRIO

    submit onSubmit Ocorre quando o usurio

    envia um formulrio.

    mouseDown onMouseDown Ocorre quando o boto 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. Vlidos apenas

    para hiperlinks.

    mouseUp onMouseUp Ocorre quando o boto 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 utilizao dos eventos dentro de alguns TAGs HTML, sem a

    necessidade de criarmos rotinas separadas para os mesmos. Vejamos o

    exemplo a seguir:

    Manipuladores de Eventos

  • No exemplo apresentado anteriormente, foi usado o evento onLoad que

    ocorre quando a pgina carregada. Neste evendo foi usada a instruo

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

    status do navegador.

    Outro exemplo que pode ser aplicado atravs de um evento, utilizar o evento

    onUnLoad que executar alguma ao quando o usurio sair de sua pgina,

    baseado no exemplo anterior, inclua no corpo de sua pgina a

    seguinte linha abaixo:

    Neste exemplo, o evento onUnLoad, faz com que se o usurio abandonar esta

    pgina seja entrando em outra, acessando hiperlinks ou at mesmo fechando o

    browser, execute a instruo alert() que tem a funo de exibir uma caixa

    de dilogo do Windows com a mensagem definida, permitindo ao usurio,

    pressionar o boto de OK para encerra-la.

    ANOTAES:

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

  • ELEMENTOS DA LINGUAGEMELEMENTOS DA LINGUAGEMELEMENTOS DA LINGUAGEMELEMENTOS DA LINGUAGEM

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

    nem por isso no deixa de ser uma linguagem de programao, com isto veja

    os elementos existentes dentro da linguagem.

    VARIVEIS

    Assim como as propriedades que armazenam dados sobre os objetos,

    possvel com JavaScript a utilizao das variveis que tm a finalidade de

    armazenar temporariamente informaes como textos, valores, datas, entre

    outros.

    O contedo de uma varivel pode ser simplesmente atribudo ou vir de um

    resultado de uma ao dada de uma expresso ou funo. Veja alguns

    exemplos.

    nome=ADRIANO LIMA

    idade=25

    Soma=2002-25

    tempo=Date()

    NOMES DE VARIVEIS

    O nome de uma varivel poder iniciar-se com uma letra ou atravs do

    caractere underscore seguido de letras ou nmeros. Outra semelhana do

    JavaScript com outras linguagens a diferenciao de de letras minsculas e

    maisculas. Veja alguns nomes vlidos para variveis:

    nome _senac escola

  • Na linguagem JavaScript existem dois tipos de variveis que so:

    GLOBAIS usadas em qualquer parte de uma aplicao.

    LOCAIS usadas somente na rotina que foi desenvolvida.

    Para criar variveis locais, necessrio que o usurio utilize a palavra-chave

    var. Veja a declarao de uma varivel local:

    var nome=ADRIANO LIMA

    var soma=2002-25

    As variveis definidas fora de uma funo sempre esto disponveis para todas

    as funes dentro do script que esto na mesma pgina. Estas variveis so

    referenciadas como variveis globais. As variveis que so definidas dentro de

    funo, tambm so globais, desde que no seja utilizado a instruo var em

    sua declarao.

    Caso o usurio declare uma varivel dentro de uma funo atravs da

    instruo var, esta varivel passa a ser apenas local, ou seja, so utilizadas

    apenas para aquela funo onde foi declarada.

    bom saber que, as variveis globais ficam na memria mesmo aps a

    execuo do script, estas variveis somente so liberadas da memria quando

    o documento descarregado.

    As variveis podem ser declaradas tambm separadas por vrgula, da seguinte

    maneira:

    var nome, endereco, telefone;

  • ou

    var nome;

    var endereco;

    var telefone;

    Outro exemplo prtico de atribuio, atribuir um mesmo valor a mais de

    uma varivel, da seguinte maneira:

    var campo1 = campo2 = campo3 = 5

    No exemplo anterior, foi atribudo o nmero 5 nas variveis campo1, campo2

    e campo3.

    Veja pelo exemplo do cdigo abaixo como manipular variveis atravs da

    linguagem JavaScript:

    CLCULOS

    valor=30

    document.write("Resultado do clculo ",(10*2)+valor)

    Neste exemplo foi definida a varivel valor que armazena o valor 30 em seu

    contedo, em seguida, atravs do objeto document foi usado o mtodo write

    que escrever no corpo da pgina o texto Resultado do clculo e em seguida

    o resultado da expresso (10*2)+valor que resultar em 50.

  • Caso tenha que executar outro clculo abaixo do primeiro, utilize o tag HTML

    aps o clculo, separando-o com vrgula e entre aspas. Veja o exemplo

    abaixo:

    document.write("Resultado do clculo ",(10*2)+valor,) document.write("A soma de 5+2 : ",5+2)

    O resultado iria apresentar os valores dos clculos um abaixo do outro, veja

    agora o mesmo exemplo colocando o resultado em negrito atravs do tag

    HTML .

    document.write("A soma de 5+2 : ","",5+2,"")

    lembre-se que estas instrues devero estar entre as tags HTML

    e . No caso de querer utilizar alguma instruo HTML, atribua-as

    entre aspas como propriedade do mtodo conforme exemplo mostrado

    anteriormente.

    LITERAIS

    So representaes de nmeros ou strings, estas informaes so fixas, bem

    diferente das variveis, no podem ser alteradas. As variveis so criadas na

    execuo do programa, j os literais fazem parte do cdigo-fonte. Veja abaixo

    alguns exemplos de literais:

    52 Nmero inteiro.

    2.1518 Nmero de ponto flutuante.

    Adriano Gomes Lima Texto.

    Existem vrios tipos de literais, eis os existentes:

  • INTEIROS (INTEGER)

    Representam nmeros positivos, negativos ou fracionrios. Exemplo:

    A=500

    B=0.52

    C=-32

    PONTO FLUTUANTE

    Este literal tambm chamado de notao cientfica representado da seguinte

    maneira:

    2.34e4

    O nmero 2.34 multiplicado por dez quarta potncia, ou 2.34*10000.

    BOOLEANOS

    Este tipo de literal representa valores lgicos que podem ser:

    TRUE ou 1

    FALSE ou 0

    LITERAIS STRING

    Este literal representa qualquer cadeia de caracteres envolvida por aspas ou

    apstrofo. Veja abaixo alguns exemplos:

    Adriano Lima

    CFP-INFORMTICA

    500

  • Mesmo sendo nmero, as aspas fazem com que o literal seja uma string.

    CARACTERES ESPECIAIS

    Estes caracteres so especificados dentro de uma string. Veja na tabela abaixo

    estes caracteres e sua descrio:

    Caractere Descrio

    \n Insere uma quebra de linha.

    \t Insere uma tabulao.

    \r Insere um retorno.

    \f Insere um caractere de barra.

    \t Tabulao.

    \ Apstrofo.

    \ Aspas.

    \\ Barra Invertida.

    \XXX

    Caractere representado pela

    codificao Latin-1. Exemplo \251

    representa o caractere de copyright .

    OBS: As letras dos operadores devem apresentar-se em letras minsculas.

    EXPRESSES

    Uma expresso normalmente uma combinao de variveis, literais,

    mtodos, funes e operadores que retornam um valor qualquer. Usada para

    atribuir valores em variveis ou at mesmo para test-la e atribuir uma ao

    especfica com base do seu resultado. Veja o exemplo da criao de uma

    varivel numrica:

    numero=5

  • Neste exemplo fora atribudo o valor nmero 5 varivel chamada numero.

    Esta atribuio de valor pode ser considerada uma expresso. Veja outro

    exemplo de expresso:

    numero2=5*2

    Neste exemplo foi atribudo o resultado da expresso 5*2 varivel chamada

    numero2 que neste caso 10. Vejamos outro exemplo em outra situao:

    If numero+numero2 > 10

    J neste exemplo foi usado a instruo condicional if que testa o resultado da

    expresso numero+numero2 e em seguida o compara com o nmero 10. Se

    o resultado da expresso for superior 10, a mesma retornar o valor

    booleano TRUE, em caso contrrio o valor passa a ser FALSE.

    OPERADORES

    Os operadores so utilizados em expresses para comparar seus contedos. O

    operador mais utilizado em uma linguagem de programao o de atribuio

    conhecido como sinal de igualdade (=). Veja abaixo alguns exemplos de sua

    utilizao:

    X=50

    X=30*5/2 X=Y

    Alm deste caractere de atribuio, possvel a utilizao de outros

    operadores como mostrado seguir:

  • x += y

    x -= y

    x *= y

    x /= y x %=y

    Analisando os operadores apresentados, podemos defini-los de outra maneira,

    conforme mostrado abaixo:

    x = x + y

    x = x y

    x = x * y

    x = x / y x = x % y

    Veja a relao dos operadores que so utilizados na linguagem JavaScript:

    ARITMTICOS

    Operador Descrio

    + Adio

    - Subtrao

    * Multiplicao

    / Diviso

    % Mdulo

    OBS: O operador Mdulo retorna o resto da diviso do operandos um e dois.

    OPERADORES DE INCREMENTO E DECREMENTO

    Alm dos operadores apresentados anteriormente, existe outro tipo de

    operador que tm a tarefa de aumentar e/ou diminuir o valor do operando. O

  • operador incremental representado pelo duplo sinal de adio ++, j o

    operador decremental representado pelo duplo sinal de subtrao --". Veja

    a seguir alguns exemplos:

    varivel++ ou ++varivel varivel-- ou --variavel

    Sempre que o operador for colocado antes do operando, incrementado ou

    decrementado o operando e o valor atualizado. Em caso contrrio, ser

    retornado o valor do operando para depois ocorrer o incremento ou

    decremento. Observe um exemplo:

    x = 10

    A = x++

    Neste exemplo, foi atribudo varivel x o valor numrico 10, e em seguida

    atribudo varivel A o valor de x incrementado, neste caso a varivel A

    recebe o valor numrico 11. analisando o caso contrrio:

    x = 10

    A = ++x

    J neste caso x incrementado e o novo valor atribudo em A. O mesmo

    ocorre para o operador de decremento.

    ANOTAES:

    ______________________________________________________

    ______________________________________________________

  • OPERADORES RELACIONAIS

    Estes operadores comparam o contedo dos operandos e retornam um valor

    booleano TRUE ou FALSE, baseado no resultado da comparao. Veja a

    relao destes operadores.

    Operador Descrio

    > Maior que

    < Menor que

    >= Maior ou igual

  • O operador ! nega uma expresso. Se for verdadeira, ser retornado

    FALSE. Se for falsa, ser retornado o valor TRUE.

    OPERADOR DE CONCATENAO DE STRING

    Para concatenar duas ou mais strings, basta utilizar o sinal de adio, veja um

    exemplo:

    A = ADRIANO

    B = LIMA

    C=A+B

    D=Senac+Minas

  • DECLARAESDECLARAESDECLARAESDECLARAES

    Vejamos agora uma relao das declaraes existentes na linguagem

    JavaScript que so utilizadas na criao da estrutura lgica de um programa.

    Normalmente estas declaraes so atribudas s tomadas de decises, laos

    repetitivos e funes.

    OPERADOR NEW

    Este operador ir permitir que o usurio crie uma nova instncia de um objeto

    definido. Veja sua sintaxe:

    NomeObjeto=new Tipo(parmetros)

    PALAVRA-CHAVE THIS

    Esta palavra-chave utilizado para fazer referncia ao objeto corrente. Veja

    sua sintaxe:

    this.propriedade

    BREAK

    Esta instruo desvia o JavaScript de uma estrutura controlada e continua sua

    execuo na primeira linha aps o bloco da instruo onde foi encontrado. Esta

    instruo pode ser utilizada em estruturas baseadas nas seguintes intrues:

    for

    for...in

    while

  • UTILIZAO DE COMENTRIOS

    Assim como qualquer outra linguagem de programao, a linguagem

    JavaScript faz o uso de comentrios que iro permitir ao programador inserir

    anotaes referentes ao seu desenvolvimento ou explicar determinada

    operao de seu script. Estes comentrios na execuo do script, so

    ignorados pelo interpretador (browser). Veja a sintaxe do uso de comentrios

    na linguagem JavaScript:

    // Comentrio de uma linha de texto.

    /* Comentrio de vrias linhas de texto, continuao do comentrio de vrias linhas */

    Conforme visto no exemplo anterior, quando o comentrio for um pequeno

    texto que ir ocupar uma linha o usurio far o uso da instruo // caso o

    mesmo ir compor mais linhas de texto no incio do comentrio utiliza-se a

    instruo /*, e aps a ltima linha de texto encerra-se com a instruo

    */.

    Alm destes comentrios recomendvel que utilize antes de iniciar um script

    o Tag de comentrio da Linguagem HTML, que ir permitir que navegadores j

    ultrapassados no sentido de no reconhecer as instrues JavaScript, possam

    ignorar estas instrues evitando erros futuros. A sintaxe de utilizao do Tag

    de comentrio em um script formada da seguinte forma:

    Observe que no final do script, foi definido um comentrio de uma linha de

    texto no JavaScript, encerrando-se com o Tag de Fechamento da Linguagem

  • HTML. O comentrio do JavaScript somente foi necessrio em razo de haver

    um texto de comentrio, caso contrrio, bastaria o Tag de Comentrio do

    HTML.

    VAR

    A palavra-chave var declara o nome de uma varivel e caso queira o usurio

    poder atribuir um valor mesma. O contedo da varivel poder ser

    visualizado por uma funo ou por outras variveis, declaradas fora da funo

    na qual foi criada. Veja alguns exemplos:

    var nome

    var endereo=R. Tupinambs 1038

    ANOTAES:

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

  • DESENVOLVIMENTO DE SCRIPTSDESENVOLVIMENTO DE SCRIPTSDESENVOLVIMENTO DE SCRIPTSDESENVOLVIMENTO DE SCRIPTS

    As instrues da linguagem JavaScript podem ser escritas em qualquer editor

    ASCII, como por exemplo, o Bloco de Notas do Windows e at mesmo o Edit

    do MS-DOS, sendo que seu arquivo dever ser salvo com a extenso HTML ou

    .JS. Para visualizar a execuo deste script, basta acess-lo atravs do

    browser.

    Quando se desenvolve scripts em uma pgina HTML, necessrio que o

    usurio os delimite atravs do Tag ou utilize-os como

    manipuladores de eventos atravs de alguns Tags HTML. Outra maneira

    criar um arquivo externo para ser chamado partir de uma pgina HTML. Este

    arquivo separado dever possuir a extenso .JS.

    DESENVOLVENDO SCRIPTS COM O TAG

    Com o Tag possvel ao usurio incorporar seus scripts dentro de

    uma pgina HTML. Veja a sintaxe de utilizao deste Tag:

    instrues do JavaScript...

    Em alguns casos possvel observar o tag SCRIPT com o seguinte atributo:

    instrues do JavaScript...

  • O atributo LANGUAGE de uso opcional, este atributo ir especificar a verso

    da linguagem JavaScript utilizado. A sua omisso assume qualquer instruo

    do JavaScript independente da sua verso.

    Se for especificada verso conforme exemplo abaixo, apenas os browsers

    que sejam compatveis com a verso especfica podero executar este script:

    instrues do JavaScript...

    DESENVOLVENDO SCRIPTS ATRAVS DE UM ARQUIVO EXTERNO

    As instrues da linguagem JavaScript podem ser executadas de um arquivo

    externo. Com isto, o usurio no precisar repetir instrues vrias vezes, isto,

    facilita a manuteno do cdigo desenvolvido e a reutilizao do mesmo.

    Para isto, o usurio dever criar o cdigo em qualquer editor ASCII da mesma

    forma que se cria uma pgina HTML, e ao salv-lo, o usurio dever atribuir ao

    seu nome a extenso .JS.

    Neste arquivo o usurio no precisar utilizar o Tag HTML para delimitar suas

    instrues.

    Para que uma pgina HTML possa processar as instrues desenvolvidas no

    arquivo externo, basta utilizar o seguinte parmetro na pgina HTML:

    Veja pela figura abaixo o cone que representa um arquivo externo com

    instrues da linguagem JavaScript:

  • Conforme dito anteriomente, a linguagem JavaScript interpretada pelo

    browser e que seu cdigo embutido dentro do cdigo HTML entre os tags

    e ou atravs de um arquivo externo que possua a

    extenso .JS. Observe o uso de algumas aes que o JavaScript pode

    desenvolver atravs da figura a seguir:

    Caixa de dilogo criada por uma instruo da Linguagem JavaScript.

    Texto inserido no corpo de uma pgina atravs de instrues da Linguagem

    JavaScript.

  • NOTIFICAO DE ERROSNOTIFICAO DE ERROSNOTIFICAO DE ERROSNOTIFICAO DE ERROS

    Alm dos comentrios, que iro evitar que os navegadores mais antigos

    exibam algum cdigo JavaScript que no reconhecido, durante o

    desenvolvimento e execuo do cdigo o programador precisar saber a

    origem de qualquer erro existente no seu programa. Para isto, possvel

    configurar o browser para exibir uma notificao de erro de script durante seus

    testes.

    Utilizando o Internet Explorer o usurio poder acessar o menu Ferramentas

    e em seguida, Opes da Internet e logo mais acessar a guia Avanada e

    selecionar a opo Exibir Notificao sobre cada erro de script conforme

    mostrado na figura a seguir:

  • Feito isto, qualquer erro existente em seu programa ser notificado pelo

    browser de acordo com a figura abaixo:

    ANOTAES:

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

  • INSTRUES BSICASINSTRUES BSICASINSTRUES BSICASINSTRUES BSICAS

    Neste ponto do treinamento o usurio ir conhecer algumas instrues que

    iro facilitar o entendimento e a construo de um programa em JavaScript.

    Sero apresentados comandos que permitiro a manipulao e insero de

    objetos em documento HTML.

    MTODO DOCUMENT.WRITE()

    Esta instruo na realidade segue a sintaxe de ponto da linguagem JavaScript,

    uma das maneiras de seguir a hierarquia dos objetos presentes na linguagem.

    Nesta linha de comando temos o mtodo write() que pertencente ao objeto

    document que retrata o documento como um todo. Vejamos um exemplo de

    sua utilizao atravs do cdigo apresentado a seguir:

    document.write("Texto inserido com instrues JavaScript");

    Atravs do exemplo apresentado anteriormente foi dado como argumento do

    mtodo write a string apresentada, determinando-o a se apresentar no corpo

    do documento, observe pelo exemplo da figura a seguir:

  • MTODO ALERT()

    A finalidade deste mtodo emitir uma caixa de dilogo do windows conforme

    mostrado no exemplo passado com uma mensagem e um boto de OK. Este

    mtodo pertencente ao objeto window do JavaScript, porm seu uso com a

    sintaxe de ponto opcional, assim sendo observe a sintaxe de seu

    funcionamento e o exemplo da prxima figura:

    window.alert("Meu Primeiro Script");

    ou

    alert("Meu Primeiro Script");

    MTODO CONFIRM()

    Uma outra alternativa alm do mtodo alert() est no mtodo confirm() que

    exibe uma caixa de dilogo e os botes de OK e CANCELAR. Caso seja

    pressionado o boto OK, o mtodo retornar o valor booleano TRUE e

    pressionado o boto CANCELAR, retornado o valor FALSE.

    Com isto, o usurio poder determinar uma tomada de deciso dentro de seu

    script. Assim como o mtodo alert(), o mtodo confirm pertencente ao

    objeto window, sendo seu uso opcional, observe sua sintaxe abaixo e veja o

    exemplo da caixa de dilogo presente na figura a seguir:

  • window.confirm("Tem Certeza??");

    ou

    confirm("Tem Certeza??");

  • COMANDOS CONDICIONAIS E REPETIOCOMANDOS CONDICIONAIS E REPETIOCOMANDOS CONDICIONAIS E REPETIOCOMANDOS CONDICIONAIS E REPETIO

    INSTRUO WHILE

    A instruo while realiza uma ao enquanto determinada condio for

    satisfeita. Sua sintaxe bsica :

    while (expresso) { comandos

    }

    Veja no exemplo seguinte a utilizao do lao while que repetido por total

    de 10 vezes:

    num=0;

    while(num

  • } alert("Obrigado, "+form1.nome.value); }

    Nome:

    INSTRUO FOR

    A instruo for realiza uma ao at que determinada condio seja satisfeita.

    Sua sintaxe bsica :

    for (incio;condio;incremento) { comandos

    }

    O incio determina o valor inicial do lao for. Normalmente 0 ou 1, porm

    poder ser especificado qualquer outro valor. O valor especificado atribudo

    em uma varivel, por exemplo i=0, count=1.

    A condio determina a expresso que ir controlar o nmero de repeties

    do lao. Enquanto esta expresso for verdadeira, o lao continuar, caso o lao

    seja falso, o lao terminar. Por exemplo: i

  • Vejamos um exemplo prtico de utilizao do lao for que conta valores de 1

    at 10, acrescentando um valor de cada vez:

    for (i=1 ; i

  • for (varivel in objeto){ instrues;

    }

    Veja pelo exemplo a seguir, o uso do lao for...in para determinar as

    propriedades do objeto navigator que contm informaes sobre o browser.

    Ao listar todas as propriedades do objeto, o lao automaticamente se

    encerrar:

    for (teste in document){ alert(teste); }

    Neste lao, foi criado uma varivel chamada teste que foi atribudo o contedo

    do objeto document. Dentro do lao foi executado a instruo alert que exibe

    o contedo da varivel teste.

    IF ... ELSE

    Realiza determinada ao de acordo com uma condio. Sua sintaxe bsica :

    if (condio) { comandos

    } else { comandos

    }

    Caso haja mais de uma condio a ser avaliada pode-se fazer o uso da

    instruo ELSE IF. Observe sua sintaxe:

  • if (condio) { comandos

    } else if (condio2) { comandos

    } else { comandos

    }

    Veja um exemplo da utilizao da instruo if:

    function condicao(){ if(form1.nome.value==""){ alert("Favor Preencher o campo"); return form1.nome.focus(); } }

    Nome:

    Neste exemplo foi criada uma funo que testar o contedo da varivel

    nome, que ocorrer assim que o usurio retirar o foco do campo, caso o valor

    da varivel esteja vazio, ser exibida uma mensagem de alerta informando

    para o preenchimento e em seguida o foco ser retornado para o campo

    nome. Em caso contrrio, o script continuar seu processamento normal at o

    fim. Criaremos agora uma condio alternativa para quando o campo no

    estiver vazio, observe:

  • function condicao(){ if(form1.nome.value==""){ alert("Favor Preencher o campo"); return form1.nome.focus(); }else{ alert("Obrigado, "+form1.nome.value); return form1.nome.select(); } }

    Nome:

    J neste exemplo, foi definido a instruo else que determinar o que deve

    ocorrer caso a condio seja falsa. No exemplo anterior, caso o campo no

    esteja vazio ser exibida outra mensagem de alerta em em seguida foi definido

    que como retorno o texto do campo ser selecionado.

    Alm dos mtodos condicionais apresentados, a linguagem JavaScript suporta

    um mtodo alternativo para criar expresses condicionais. Este mtodo j

    suportado em outras linguagens de programao permite ao usurio construir

    um exemplo prtico e simples para sua utilizao. Sua sintaxe bsica tem a

    seguinte formao:

    (condio) ? Valor verdadeiro : Valor falso;

    Onde condio, a expresso ser avaliada.

  • Onde Valor verdadeiro, especifica a ao que ocorrer se a condio for

    verdadeira.

    Onde Valor falso, especifica a ao que ocorrer caso a condio seja falsa.

    Veja abaixo um exemplo de utilizao deste tipo de expresso condicional:

    exemplo=prompt("Digite seu nome ou clique em Cancelar.",""); (exemplo==null) ? alert("O usurio Cancelou!") : alert("O usurio digitou: "+exemplo);

    Assim como na maioria das linguagens de programao a instruo if no est

    limitada a utilizao apenas do sinal de igualdade (==). O usurio poder

    fazer diferentes tipos de testes lgicos como se os valores so diferentes,

    maior que ou menor que, entre outros.

    RETURN

    Esta instruo tem como finalidade marcar o final de uma funo. A linguagem

    JavaScript ao encontrar esta instruo ele ir retornar para o ponto

    imediatamente aps a chamada da funo. Ela ainda pode ser definida com um

    valor de retorno ou no.

    Quando um valor includo com esta instruo, a funo ir retornar este valor

    definido pela instruo. Quando um valor no incldo com a instruo return,

    ento a funo retorna um valor nulo.

    Por padro, esta instruo jamais usada fora de uma funo. Quando isto

    acontece, a linguagem ir retornar um erro quando a mesma estiver definida

    fora de uma funo. Os parnteses apresentados no exemplo abaixo no so

    obrigatrios.

    Vejamos alguns exemplos de scripts usando a instruo return.

  • SWITCH

    Esta instruo bem semelhante com uma estrutura IF, porm mais

    eficiente em razo de ser mais simples sua utilizao e seu entendimento. Veja

    a sintaxe utilizada para o uso de instrues SWITCH:

    switch (expresso){ case CONSTANTE:

    comandos;

    break;

    case CONSTANTE2:

    comandos;

    break;

    case default:

    comandos;

    break;

    }

  • INSTRUO WITH

    Esta instruo faz com que um objeto se torne default para uma srie de

    opes existentes. Normalmente esta instruo utilizada com o objeto Math,

    uma vez que ele exige que o usurio especifique o nome do objeto quando

    acessar qualquer uma de suas propriedades. Veja sua sintaxe:

    with (objeto){ instrues

    }

    Vejamos alguns exemplos de sua utilizao:

    alert(Math.PI); alert(Math.round(1234.5678));

    Utilizando a instruo with o usurio ir determinar os valores que deseja

    economizando tempo na aplicao. Observe como ficaria estas instrues

    aplicadas com a instruo with:

    with (Math){ alert(PI); alert(round(1234.5678)); }

    Veja pelo exemplo anterior, que o usurio no necessitou utilizar o objeto

    Math vrias vezes.

  • Outra questo, que a instruo with no utilizada somente com o objeto

    Math. Ela poder ser usada com a maioria dos outros objetos da linguagem

    JavaScript.

  • FUNESFUNESFUNESFUNES

    Funes em JavaScript nada mais so que uma rotina JavaScript que possui

    um conjunto de instrues serem executadas. Sua sintaxe compem-se dos

    seguintes parmetros:

    function nomeFuno(argumentos) { Comandos

    }

    Se a funo possuir argumentos, estes devero estar colocados entre

    parnteses aps o nome da funo. O corpo da funo dever ser colocado

    entre chaves que indicaro o incio do bloco de instrues e o fim do bloco de

    instrues.

    Normalmente, as funes so definidas dentro do cabealho da pgina HTML

    representados pelo tag . Com isto, todas as funes so carregadas

    assim que a pgina carregada, bem antes que o usurio pense em executar

    alguma ao.

    Vejamos um exemplo simples de uma funo que exibe uma mensagem na

    tela:

    function primeiraFuncao(){ alert("Isto uma funo JavaScript"); }

    Com isto, o usurio apenas definiu a funo, para que ela seja executada,

    necessrio fazer a sua chamada. Para chamar a funo basta incluir seu nome

    no local do cdigo que deseja que ela seja executada. No exemplo a seguir,

  • note que aps a funo foi feita sua chamada, bastando para tanto redigir seu

    nome, observe:

    function primeiraFuncao(){ alert("Isto uma funo JavaScript"); } primeiraFuncao();

    padro da linguagem JavaScript que ao encontrar a chamada de uma funo,

    ele desvia para as instrues respectivas desta funo e ao termin-la, volta

    para o primeiro cdigo aps a chamada da funo.

    Uma funo pode ser chamada de diversas formas, dentro da rea do cdigo

    JavaScript e at mesmo atravs de um evento dentro de um tag HTML, como

    um boto de formulrio ou hiperlink. Veja um exemplo de uso da chamada de

    uma funo atravs da ao do usurio ao clicar em um boto de formulrio:

    UTILIZANDO FUNES

    function primeiraFuncao(){ alert("Isto uma funo JavaScript"); }

  • Neste exemplo, foi definido a chamada da funo atravs do evento onClick

    que processado assim que o usurio d um clique sobre o boto que

    executar a funo.

    O usurio poder atravs do uso de funes passar valores a mesma, com isto

    a funo usar os valores no processamento. Vejamos no exemplo abaixo que

    foi definido como argumento da funo exemplo a varivel texto, esta

    varivel usada como o texto que ser exibido pela instruo alert. Ao

    chamar a funo, basta o usurio definir o texto que deseja ser apresentado

    como argumento da funo:

    function exemplo(texto){ alert(texto); } exemplo("Curso de JavaScript");

    Em algumas situaes o usurio talvez queira retornar um valor de uma

    funo. Para isto, basta fazer o uso da instruo return mais o valor que

    queira retornar. Vejamos um exemplo tpico do uso de uma funo que ir

    retornar um determinado valor. Observe:

    var ret=prompt("digite o nome",""); var shor=mostranome(ret); alert(shor);

    function mostranome(nome){ if (nome=="" || nome==null) return ("erro"); else

  • return (nome); }

    OBJETO ARGUMENTS

    Normalmente as funes so declaradas para aceitar um determinado nmero

    de parmetros, vejamos um exemplo que usa uma funo que declarada

    para usar dois argumentos e usados para exibir os mesmos em uma

    mensagem de alerta:

    mensagem("SENAC","Minas Gerais");

    function mensagem(mensagem1,mensagem2){ alert(mensagem1); alert(mensagem2); }

    claro que se houvesse vrios argumentos serem exibidos, isto seria uma

    maneira penosa de programar. Atravs da linguagem JavaScript, o usurio

    poder fazer uso do objeto arguments que criado dentro de uma funo.

    Este objeto um array que poder receber todos os argumentos necessrios

    para passar a funo quando a mesma for chamada. Veja no exemplo a seguir

    sua utilizao:

    mensagem("SENAC","Minas Gerais"); mensagem("CFP","Informtica");

    function mensagem(){ for (i=0;i

  • alert(mensagem.arguments[i]); } }

  • UTILIZANDO UTILIZANDO UTILIZANDO UTILIZANDO EVENTOSEVENTOSEVENTOSEVENTOS

    EVENTO ONBLUR

    Com o evento onBlur o usurio ir controlar o contedo de um elemento em

    um formulrio select, text ou textarea quando o mesmo remove o foco. Veja

    pelo exemplo a seguir de uma caixa de texto exibir uma mensagem na tela

    assim que o campo perde o foco:

    Digite seu Nome:

    Veja agora outro exemplo, criando uma funo para que caso o usurio deixe o

    campo em branco, seja exibida a mensagem de alerta:

    Digite seu Nome:

  • EVENTO ONCHANGE

    Com o evento onChange o usurio poder acionar alguma funo sempre que

    for alterado o contedo dos objetos textarea, text ou select. Este evento

    bem similar com o evento onBlur, porm ele verifica se o contedo do

    elemento foi alterado. Vejamos um exemplo de sua utilizao:

    Digite seu Endereo:

    EVENTO ONCLICK

    O evento onClick utilizado em links, botes, radio, checkbox, reset. Vejamos

    um exemplo de sua utilizao em um boto de formulrio:

    EVENTO ONFOCUS

    Com o manipulador onFocus o usurio poder criar uma ao sempre que os

    elementos select, text ou textarea receberem o foco. Ao contrrio do evento

    onBlur que executa aes sempre que o elemento perde o foco. Veja um

    exemplo de sua utilizao:

  • Digite seu Nome:

    Digite seu Endereo:

    EVENTO ONLOAD

    Conforme exemplo mostrando anteriormente, com o evento onLoad executa

    alguma ao assim que o documento carregado no browser. Este objeto

    aplicado diretamente ao objeto window.

    Veja abaixo um exemplo de exibio de uma mensagem de alerta assim que a

    pgina carregada:

    EVENTO ONUNLOAD

    Com o evento onUnLoad o usurio pode determinar uma ao assim que o

    usurio sai da pgina, seja por meio de um hiperlink ou at mesmo fechando o

    navegador. Com base no exemplo anterior foi criado uma mensagem de alerta

    assim que o usurio deixa a pgina:

    EVENTO ONMOUSEOVER

  • Com o evento onMouseOver o usurio criar uma ao que ser acionada

    sempre que o ponteiro do mouse se mover sobre um link. Veja um exemplo de

    sua utilizao:

    SENAC

    Ser exibida uma mensagem na barra de status, assim que o mouse sair de

    cima do link. Para evitar este problema, atribua para este evento a instruo

    return true que executar o comando executado sem problemas. Veja pelo

    exemplo a seguir:

    SENAC

    Lembre-se que quando quiser executar duas aes para o mesmo evento,

    basta separ-las com um ponto e vrgula.

    EVENTO ONMOUSEOUT

    Com este evento o usurio poder determinar uma ao assim que o mouse

    sair de cima de um hiperlink. Pelo exemplo do evento onMouseMove o

    usurio consegue atribuir uma mensagem na barra de status, porm a

    mensagem permanece, utilizando o evento onMouseOut, o usurio poder

    informar o que deve acontecer quando o ponteiro do mouse sair do objeto.

    Avaliando o exemplo anterior, vamos determinar que ao ponteiro do mouse

    sair do hiperlink, a mensagem da barra de status ser omitida. Veja pelo

    exemplo a seguir:

  • SENAC

    EVENTO ONMOUSEDOWN

    O evento onMouseDown ocorre sempre que pressionado o boto do mouse.

    Veja pelo exemplo apresentado abaixo:

    SENAC

    EVENTO ONMOUSEUP

    O evento onMouseUp ocorre sempre que o boto do mouse solto. Este

    evento segue os mesmos padres do evento apresentado anteriormente.

    EVENTO ONKEYPRESS

    O evento onKeyPress ocorre sempre que uma tecla pressionada. Este

    evento segue os mesmos padres do evento apresentado anteriormente.

    EVENTO ONKEYDOWN

    O evento onKeyDown ocorre sempre que uma tecla abaixada. Este evento

    segue os mesmos padres do evento apresentado anteriormente.

    EVENTO ONKEYUP

  • O evento onKeyUp ocorre sempre que uma tecla solta. Este evento segue os

    mesmos padres do evento apresentado anteriormente.

    EVENTO ONSELECT

    O evento onSelect ocorre sempre quando o usurio seleciona um texto dos

    elementos de formulrio text ou textarea.

    Vejamos um exemplo de sua utilizao:

    Digite seu Nome:

    EVENTO ONSUBMIT

    O evento onSubmit ocorre sempre que o usurio envia o formulrio. Com este

    evento o usurio poder determinar ou no o envio do formulrio. Vejamos um

    exemplo para sua utilizao:

    Com este evento o usurio poder verificar a validao de dados, como por

    exemplo se todos os campos do formulrio esto preenchidos.

    Veja agora um exemplo desta utilizao, caso o campo especfico esteja em

    branco o usurio receber uma mensagem informando que o campo no foi

    preenchido:

  • function teste(){ if (form1.campo1.value==""){ alert("FAVOR PREENCHER"); return(false); } else { return(true); } } -->

    Digite seu Nome:

  • FUNES DA LINGUAGEM JAVASCRIPTFUNES DA LINGUAGEM JAVASCRIPTFUNES DA LINGUAGEM JAVASCRIPTFUNES DA LINGUAGEM JAVASCRIPT

    As funes utilizadas em JavaScript so embutidas no ncleo da linguagem.

    Estas funes no pertencem nenhum objeto, elas funcionam com variveis

    nmero e as que no so objetos. Com estas funes no necessrio a

    declarao de um objeto-pai para us-las, sendo bem diferentes dos mtodos

    como por exemplo document.write. Write o mtodo pertencente ao objeto

    document.

    FUNO EVAL

    Esta funo avalia uma expresso que poder ser em formato string, o que se

    torna prtico quando o usurio deseja estabelecer expresses no momento em

    que for preciso. Sua sintaxe formada da seguinte maneira:

    eval(expresso);

    Criaremos um exemplo que ir avaliar uma expresso que contm nmeros,

    operadores e strings. Neste exemplo formaremos um clculo que ser

    representado como string. Com o uso da funo eval, ser testado todos os

    argumentos da funo fazendo a compreenso de todos os elementos

    presentes:

    valor=5

    alert(eval("2*valor"));

  • FUNO ISNAN

    A funo isNaN tem a finalidade de testar um nmero para determinar se

    no se no um nmero. Normalmente esta funo usada para comparar

    valores do tipo nmero ou string. Com o emprego desta funo o usurio

    poder determinar se um valor contm realmente um valor numrico. Esta

    funo pode ser utilizada em conjunto com as funes parseInt e parseFloat

    em razo de retornarem a string NaN quando o contedo da varivel no um

    nmero. Sua sintaxe tem a seguinte formao:

    isNaN(valor);

    No exemplo a seguir, foi criado um script bem simples que testa se o valor

    digitado no campo de formulrio um nmero.

  • function condicao(valor){ if(isNaN(valor)){ alert("No um nmero!!!"); } }

    Nome:

    FUNO PARSEFLOAT

    Com a funo parseFloat, feita a converso de um objeto string, retornando

    um valor de ponto flutuante. Com ela convertido uma string em um valor

    numrico equivalente. Se a funo encontrar um caractere diferente de um

    sinal (+ ou -), nmeros (0 9), ponto decimal ou expoente, ser retornado o

    valor at aquele ponto e ignorado o restante. Caso o primeiro caractere no

    puder ser convertido para um nmero, parseFloat ir retornar os valores 0

    para a plataforma Windows e NaN para as outras plataformas. Sua sintaxe

    tem a seguinte formao:

    parseFloat(string);

    Veja a seguir um exemplo da utilizao da funo parseFloat.

    valor=parseFloat("123,456"); alert(valor)+1;

  • FUNO PARSEINT

    Com a funo parseInt, o usurio poder converter valores de string em

    valores numricos equivalentes. possvel a converso de nmeros de bases

    como hexadecimal ou octal em valores decimais. Caso a funo encontra um

    caractere diferente de um sinal (+ ou -), nmeros (0 9), ponto decimal ou

    expoente, ser retornado o valor at aquele ponto e ignorado o restante. Caso

    o primeiro caractere no puder ser convertido para um nmero, a funo

    parseInt ir retornar o valor 0 para Windows e NaN para outros sistemas. Sua

    sintaxe tem a seguinte formao:

    parseInt(string,radix);

    Onde apresentado radix, um inteiro que representa a base do valor de

    retorno. No exemplo a seguir convertido um valor string em seu valor

    numrico equivalente:

    valor=parseInt("123.456"); alert(valor);

    atravs do parmetro radix, possvel a converso de um nmero de uma

    base para decimal, j no caso contrrio isto no possvel. Veja um exemplo

    de sua utilizao:

    valor=parseInt("ff",16); //Converso hexadecimal, retorna 255 valor=parseInt("0xff",16); //Converso hexadecimal, retorna 255 valor=parseInt("1111",2); //Converso binrio, retorna 15 valor=parseInt("765",8); //Converso octal, retorna 501

    Vejamos os valores de cada base existente:

  • 2 Binrio.

    8 Octal.

    10 Decimal.

    16 Hexadecimal.

    A omisso do parmetro radix, a linguagem JavaScript assume que o valor

    definido est no formato decimal.

  • FUNES PRFUNES PRFUNES PRFUNES PR----PROGRAMADASPROGRAMADASPROGRAMADASPROGRAMADAS

    As funes pr-programadas do JavaScript, permite ao usurio executar

    operaes simples como configurar sua pgina como inicial, adicionar uma URL

    ao favoritos, imprimir o documento, aumentar sua lgica de raciocnio

    facilitando a criao de novos scripts, entre outras operaes. Vejamos alguns

    exemplos.

    IMPRESSO DA PGINA

    Atravs da funo print(), o usurio poder executar a funo de imprimir

    evitando caminhos longos para isto ou facilitar ao usurio iniciante em

    informtica, abaixo segue um exemplo simples:

  • JANELA EM MOVIMENTO

    Outro Exemplo interessante a abertura de uma pgina que abre uma janela

    em movimento. Veja o cdigo abaixo e faa um teste:

    function expandingWindow(website) { var heightspeed=2;//velocidade vertical (valor maior = mais lento) var widthspeed=7;//velocidade horizontal(valor maior = mais lento) var leftdist = 0; // distncia do canto esquerdo da janela var topdist = 0; // distncia do canto superior da janela if (document.all) { var winwidth = window.screen.availWidth - leftdist;

    var winheight = window.screen.availHeight - topdist;

    var sizer = window.open("","","left=" + leftdist + ",top=" + topdist + ",width=1,height=1,scrollbars=yes"); for (sizeheight = 1; sizeheight < winheight; sizeheight += heightspeed) { sizer.resizeTo("1", sizeheight); } for (sizewidth = 1; sizewidth < winwidth; sizewidth += widthspeed) {

  • sizer.resizeTo(sizewidth, sizeheight); } sizer.location = website;

    } else

    window.location = website;

    } // End --> Open JavaScriptSource.com!

    TEXTO NA BARRA DE STATUS EM MOVIMENTO

    var speed = 10

    var pause = 1500

    var timerID = null

    var bannerRunning = false

    var ar = new Array() ar[0] = "Adriano... " ar[1] = "Gomes" ar[2] = "Lima" ar[3] = "Informtica:" ar[4] = " cidade de Santos." var message = 0

    var state = ""

    clearState() function stopBanner() { if (bannerRunning)

  • clearTimeout(timerID) timerRunning = false

    } function startBanner() { stopBanner() showBanner() } function clearState() { state = ""

    for (var i = 0; i < ar[message].length; ++i) { state += "0"

    } } function showBanner() { if (getString()) { message++

    if (ar.length

  • full = false

    } if (full) return true while (1) { var num = getRandom(ar[message].length) if (state.charAt(num) == "0") break

    } state = state.substring(0, num) + "1" + state.substring(num + 1, state.length) return false

    } function getRandom(max) { var now = new Date() var num = now.getTime() * now.getSeconds() * Math.random() return num % max

    } // -->

    TABELA DE CORES

    function geraTabela() {

    document.write('');

    var valores = "00336699CCFF";

    var r, g, b;

    var cor;

    for (r=0; r

  • if (g%2==0) document.write(""); for (b=0; b
  • texto = document.form1.marquee.value + mensagem +

    document.form1.marquee.value;

    tamanho = texto.length;

    janela = document.form1.marquee.size; atualizarMarquee(); ligado = true;

    }

    function pararMarquee(){ if (ligado) clearTimeout(timeoutID); ligado = false;

    }

    function atualizarMarquee(){ document.form1.marquee.value=texto.substring(posicao++%tamanho, posicao+janela%tamanho); timeoutID = setTimeout("atualizarMarquee()", 100); } // -->

  • OBJETOS PROBJETOS PROBJETOS PROBJETOS PR----CONSTRUDOSCONSTRUDOSCONSTRUDOSCONSTRUDOS

    A linguagem JavaScript possui objetos padronizados para uso nos scripts.

    Dentre eles, temos:

    DATE Manipula datas e horas.

    STRING Manipula strings.

    MATH Realiza operaes matemticas.

    OBJETO DATE

    O objeto DATE permite que o usurio possa trabalhar com datas e horas. Para

    determinar um novo objeto de data, temos as seguintes sintaxes:

    NomeObjeto=new Date()

    NomeObjeto=new Date(ms dia,ano horas:minutos:segundos)

    NomeObjeto=new Date(ano,ms,dia)

    NomeObjeto=new Date(ano,ms,dia,horas,minutos,segundos)

    Veja exemplos conforme sintaxe apresentada anteriomente:

    Data=new Date() atribui a varivel data, a data e hora correntes.

    Data=new Date(1975,11,23) atribui a varivel data, a data 23 de

    novembro de 1975.

  • MTODOS DO OBJETO DATE

    Se o usurio desejar utilizar os mtodos do objeto de data, deve-se seguir a

    seguinte sintaxe:

    NomeObjeto.mtodo(parmetros)

    Veja a relao dos mtodos utilizados no objeto DATE:

  • OBJETO STRINGOBJETO STRINGOBJETO STRINGOBJETO STRING

    PROPRIEDADES

    Os objetos string so de nvel superior.

    SINTAXE

    Varivel=valor

    S1=SENAC

    PROPRIEDADES DO OBJETO STRING

    Veja na tabela a seguir a relao das propriedades do objeto String:

    PROPRIEDADES DESCRIO

    length Comprimento de uma string.

    MTODOS DO OBJETO STRING

    Os mtodos do objeto string permitem a manipulao do objeto. O usurio

    poder utilizar string literal ou de variveis. Vejamos sua sintaxe abaixo:

    String literal.mtodo()

    TextString=string de varivel

  • TextString.mtodo()

    MTODO ANCHOR

    Este mtodo tem a funo de criar uma ncora a partir de uma string. Este

    mtodo similar criao de uma ncora utilizando o tag HTML , o mesmo ocorreria se definir string.anchor(valor).

    Vejamos a sintaxe de utilizao do mtodo anchor:

    String.anchor(nome)

    Veja um exemplo de utilizao deste mtodo:

    Ancora="Incio do Documento";

    valor=Ancora.anchor("inicio"); document.write(valor);

    Este script poderia ser utilizado pela linguagem HTML atravs do seguinte

    cdigo:

    Incio do Documento

    MTODO BIG

    Este mtodo substitui o tag HTML , que tem a funo de aumentar a

    fonte e atribuir o estilo de negrito. Para utiliz-lo, siga a seguinte sintaxe:

    string.big();

    Veja o exemplo de utilizao deste mtodo:

  • texto="SENAC-MG";

    document.write(texto.big());

    MTODO SMALL

    Este mtodo substitui o tag HTML que tem a funo de reduzir o

    tamanho da fonte. Para utiliz-lo, siga a seguinte sintaxe:

    String.small();

    Veja o exemplo de utilizao deste mtodo:

    texto="SENAC-MG";

    document.write(texto.small());

    MTODO BOLD

    Referente ao tag HTML que tem a funo de atribuir o estilo de negrito

    sobre o texto. Sua sintaxe segue o seguinte padro:

    String.bold();

    Veja o exemplo de utilizao deste mtodo:

    texto="SENAC-MG";

    document.write(texto.bold());

  • MTODO ITALICS

    Este mtodo referente ao tag HTML que atribui o estilo de itlico em um

    texto. Sua sintaxe segue o mesmo padro do mtodo bold. Veja abaixo um

    exemplo da utilizao do mtodo italics

    texto="SENAC-MG";

    document.write(texto.italics());

    MTODO FIXED

    Com o mtodo fixed, possvel formatar o qualquer texto em fonte fixa, ou

    como conhecido em HTML, em fonte monoespao definido pelo tag . Sua

    sintaxe segue a seguinte composio:

    String.fixed();

    Exemplo de utilizao do mtodo fixed:

    texto="SENAC-MG";

    document.write(texto.fixed()); texto2="ADRIANO LIMA".fixed(); document.write("",texto2);

  • MTODO STRIKE

    Este mtodo tem a funo de criar um texto tachado que exibe uma linha no

    meio do texto exibido. Este mtodo tem a mesma funo do tag HTML

    . Sua sintaxe bsica segue o seguinte padro:

    texto="SENAC-MG";

    document.write(texto.strike());

    MTODO FONTCOLOR

    Determina a cor da fonte em um texto de acordo com o tag HTML .

    SINTAXE

    String.fontcolor(cor);

    Exemplo de utilizao do mtodo fontcolor:

    texto="SENAC-MG";

    document.write(texto.fontcolor("red")); document.write("Informtica".fontcolor("blue"));

    O mtodo fontcolor aceita nomes de cores slidas, assim como, os valores

    hexadecimais da cor referente.

  • MTODO FONTSIZE

    Este mtodo, determina o tamanho da fonte seguindo os padres do tag HTML

    que possui tamanhos que vo de 1 a 7, assim como a

    possibilidade de valores relativos atravs dos sinais de + e -. Sua sintaxe

    bsica segue o seguinte padro:

    texto="SENAC-MG";

    document.write(texto.fontsize(7));

    MTODO SUB

    Este mtodo cria um texto subscrito tendo o mesmo efeito do tag HTML

    . Sua sintaxe bsica tem a seguinte formao:

    String.sub();

    Veja um exemplo para sua utilizao:

    texto="SENAC-MG";

    document.write(texto.sub());

    MTODO SUP

    Este mtodo cria um texto sobrescrito tendo o mesmo efeito do tag HTML

    . Sua sintaxe bsica tem a seguinte formao:

  • String.sup();

    Veja um exemplo para sua utilizao:

    texto="SENAC-MG";

    document.write(texto.sup());

    MTODO charAT

    Com este mtodo o usurio poder retornar o caractere em uma determinada

    posio em uma string. Por exemplo, temos a string SENAC e a posio de

    referncia 3, com base nisto o caractere de retorno A. Estas posies

    so contadas partir de 0 da esquerda para a direita.

    SINTAXE:

    String.charAt(valorRetorno);

    Veja o exemplo de utilizao do mtodo charAt:

    texto="SENAC-MG";

    document.write(texto.charAt(3));

    MTODO INDEXOF

    Com o mtodo indexOf o usurio pode retornar a posio de um caractere

    dentro de uma string. Um exemplo claro do mtodo indexOf, a maneira de

    saber se determinada string possui algum caractere especfico. Caso a string

    no contiver o caractere especfico, o mtodo ir retornar o valor 1, caso haja

  • a ocorrncia do caractere procurado, ser retornado o valor 0 ou superior,

    sendo que 0 a posio do primeiro caractere da string, 1 a posio do

    segundo caractere e assim por diante. Caso exista duplicidade do caractere

    especfico, o mtodo ir retornar a posio do primeiro caractere encontrado.

    Sua sintaxe segue o seguinte padro:

    string.indexOf(caractere)

    Veja pelo exemplo a utilizao do mtodo indexOf:

    texto="SENAC-MG";

    document.write(texto.indexOf("A"));

    Valor retornado: A

    Uma das prticas utilizaes deste mtodo, determinar se determinado valor

    de uma string um nmero ou uma letra.

    MTODO LASTINDEXOF

    Com o mtodo lastIndexOf o usurio poder retornar a ltima posio de um

    determinado caractere em uma string. Um exemplo de utilizao deste mtodo

    a de retornar a posio de um caractere barra (/) em uma string, para por

    exemplo utilizar com URLs. Sua sintaxe bsica, segue o seguinte exemplo:

    String.lastIndexOf(caractere,offset);

    Onde caractere, o caractere que deseja procurar dentro da string.

  • Onde offset, a posio na string a partir de onde o usurio deseja comear a

    pesquisa. Veja abaixo um exemplo que localiza a ltima ocorrncia da letra

    N na string SENAC-MG utilizada como exemplo.

    texto="SENAC-MG";

    document.write(texto.lastIndexOf("N"));

    O resultado ser 2. bom lembrar que as strings sempre se baseiam em 0).

    MTODO LINK

    Este mtodo similar ao tag HTML que tem a funo de criar

    hiperlinks em uma pgina. Sua sintaxe bsica tem a seguinte formao:

    String.link(href);

    Onde href a referncia de vnculo do hiperlink.

    Vejamos um exemplo:

    texto="SENAC-MG";

    document.write(texto.link("http://www.mg.senac.br"));

    MTODO REPLACE

    Este mtodo tem a funo de trocar valores dentro de uma string. Sua sintaxe

    bsica tem a seguinte formao:

    String.replace(s1,s2);

  • Onde s1 o caractere procurado dentro de uma string.

    Onde s2 o novo caractere que ser trocado por s1.

    Vejamos um exemplo simples que ao ser digitado um nome com acento agudo

    na letra A, ao clicar sobre o um boto trocado a letra sem acento.

    function troca(){ texto=document.form1.nome2.value;

    document.form1.nome2.value=texto.replace("","a"); }

    Logo a seguir o cdigo do boto que chama a funo troca().

    MTODO SUBSTRING

    Este mtodo retorna uma parte de uma string. O usurio poder especificar o

    incio e o final da parte que deseja extrair indicando a posio inicial como 0, j

    a posio final determinada com a instruo string.length-1, isto , um a

    menos do que o comprimento da string. Sua sintaxe bsica tem a seguinte

    formao:

    string.substring(incio,fim);

    Vejamos um exemplo da utilizao do mtodo substring:

    texto="SENAC-MG";

    document.write(texto.substring(0,4));

  • Valor retornado: SENA.

    MTODO TOLOWERCASE

    Com o mtodo toLowerCase o usurio poder converter uma string em letras

    minsculas. Sua sintaxe bsica segue o seguinte padro:

    texto="SENAC-MG";

    document.write(texto.toLowerCase));

    Veja que o contedo da varivel texto est em letras maisculas, com o uso

    do mtodo toLowerCase, este texto ser apresentado no documento em

    letras minsculas.

    MTODO TOUPPERCASE

    Com o mtodo toUpperCase, o usurio poder converter uma string em letras

    maisculas. Sua sintaxe bsica segue o seguinte padro:

    texto="senac-mg";

    document.write(texto.toUpperCase));

  • OBJETO IMAGEOBJETO IMAGEOBJETO IMAGEOBJETO IMAGE

    Na linguagem JavaScript as imagens que so inseridas atravs da linguagem

    HTML so consideradas cada uma um objeto do tipo IMAGE. Com isto,

    podemos concluir que as imagens possuem propriedades e mtodos assim

    como os outros objetos j existentes. Atravs deste objeto possvel que o

    usurio possa interagir melhor e dinamicamente as imagens utilizadas em suas

    pginas.

    Vejamos pelo exemplo a seguir a instruo HTML que insere uma imagem em

    uma pgina.

    At aqui tudo bem, mas note que fora atribudo uma varivel nesta imagem

    atravs do atributo name. Esta varivel serve para fazer referncia imagem

    atualmente inserida na pgina no cdigo JavaScript que ser desenvolvido.

    Vamos agora inserir um boto de formulrio que ser responsvel pelo evento

    que iremos desenvolver, logo nosso cdigo ficar da seguinte forma:

    No cdigo a seguir, foi utilizado o evento onClick que determinar a ao para

    o boto. Esta ao foi designada para trocar a imagem atualmente inserida por

  • outra imagem. Note que foi feita uma referncia para inserir nova imagem

    no local da imagem atual.

    Em anlise sobre este cdigo simples, foi determinado que no documento

    atual, especificamente no objeto chamado senac que trata a figura atualmente

    inserida, ser originada outra imagem iso9001.gif em seu local atual.

    Resultando na troca da imagem. Veja agora o mesmo cdigo fazendo

    alternao entre as duas imagens de acordo com a opo escolhida, observe:

    observe agora a criao de uma funo que far com que quando o usurio

    mover o mouse sobre a imagem a mesma ser ampliada e ao movimentar

    para fora da imagem, a mesma retornar ao seu tamanho original:

  • function figura(valor){ document.senac.width=valor;

    }

    ANOTAES:

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

    ______________________________________________________

  • MTODOS DE INTERFACMTODOS DE INTERFACMTODOS DE INTERFACMTODOS DE INTERFACE COM O USURIOE COM O USURIOE COM O USURIOE COM O USURIO

    Com e