• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Manual curso php
 

Manual curso php

on

  • 716 views

fdhdfhdf

fdhdfhdf

Statistics

Views

Total Views
716
Views on SlideShare
716
Embed Views
0

Actions

Likes
0
Downloads
24
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Manual curso php Manual curso php Document Transcript

    • Companhia de Processamento de Dados do Salvador PRODASAL ISO 9001:2000Curso: Linguagem PHPDiretoria Administrativa – Coordenadoria de Gestão de PessoasInstrutor: Edson Queiroz SantosPeríodo: 11 a 22/09/2006 Introdução à Linguagem HTMLHTML (HyperText Markup Language - Linguagem de Formatação de Hipertexto).Todo documento HTML apresenta elementos entre parênteses angulares (< e >); esses elementossão as etiquetas (tags) de HTML, que são os comandos de formatação da linguagem. A maioriadas etiquetas tem sua correspondente de fechamento: <etiqueta>...</etiqueta>Isso é necessário porque as etiquetas servem para definir a formatação de uma porção de texto, eassim marcamos onde começa e termina o texto com a formatação especificada por ela.Alguns elementos são chamados “vazios”, pois não marcam uma região de texto, apenas inseremalguma coisa no documento:<etiqueta>Todos os elementos podem ter atributos:<etiqueta atributo1=valor1 atributo2=valor2>...</etiqueta>HTML é um recurso muito simples e acessível para a produção de documentos. Nestes“capítulos”, será possível aprender grande parte de seus elementos Edição de documentos HTMLOs documentos em HTML são como arquivos ASCII comuns, que podem ser editados em vi,emacs (que já tem versão para editar arquivos HTML), textedit, ou qualquer editor simples.Para facilitar a produção de documentos, existem editores HTML específicos:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 1 -
    • Publicação de documentosPara ter sua homepage é necessário ter uma área na rede; o primeiro passo é criar um diretórioWWW (em letras maiúsculas) em sua área de rede. A partir do momento da criação dessediretório WWW, o URL:A seguir, certifique-se de que sua área e o diretório WWW dentro dela estejam com permissãode leitura para "todo mundo".Feito isso, basta contactar os Webmasters para que sua página seja referenciada através da listade "pessoas com página", ou da página do seu grupo de pesquisa.Obs.: Estas diretivas se aplicam em particular à rede do ICMC; outros sistemas podem ter outrasconfigurações, bem diferentes. Documento básico e seus componentesA estrutura de um documento HTML apresenta os seguintes componentes:<HTML><HEAD><TITLE>Titulo do Documento</TITLE></HEAD><BODY>texto,imagem,links,...</BODY></HTML>As etiquetas HTML não são sensíveis à caixa. Traduzindo: tanto faz escrever <HTML>, <Html>,<html>, <HtMl>, ...Os documentos se dividem em duas seções principais, que veremos a seguir.A Seção <HEAD><HEAD> contém informações sobre o documento; o elemento <TITLE>, por exemplo, defineum título, que é mostrado no alto da janela do browser. Nesta página, por exemplo, está definidoassim:<HEAD><TITLE>Documento basico em HTML</TITLE></HEAD>Todo documento WWW deve ter um título; esse título é referenciado em buscas pela rede,dando uma identidade ao documento.É sugerido que os títulos dos documentos sejam sugestivos, evitando-se, portanto, títulos como"Introducao". De preferência, os títulos não devem conter acentos ou outros caracteres especiais(eles não serão mostrados corretamente pelos sistemas de janela em algumas plataformas).Além do título, HEAD contém outras informações que podem ser recuperadas por robôs depesquisa na Internet; esses campos de informação facilitam a classificação do documento emcatálogos de busca, entre outras aplicações.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 2 -
    • A Seção <BODY>Tudo que estiver contido em <BODY> será mostrado na janela principal do browser, sendoapresentado ao leitor. <BODY> pode conter cabeçalhos, parágrafos, listas, tabelas, links paraoutros documentos, e imagens.Veja um documento básico em HTML.<BODY> tem alguns atributos de apresentação que são aplicados ao documento Atributos gerais de um documentoComo visto anteriormente (documento básico e seus componentes), <HEAD> contéminformações sobre o documento. Além de <TITLE>, existem diversos outros campos deinformação, sendo os campos <META> os mais usados.Campos <META>Os campos <META> têm dois atributos principais:  NAME, indicando um nome para a informação.  HTTP-EQUIV, que faz uma correspondência com campos de cabeçalho do protocolo HTTP; a informação desse campo pode ser lida pelos browsers, e provocar algumas ações.<HEAD><TITLE>Titulo do Documento</TITLE><META NAME="nome" CONTENT="valor"><META HTTP-EQUIV="nome" CONTENT="valor"></HEAD>Este documento, por exemplo, tem as seguintes informações:<HEAD><TITLE>Atributos de documentos em HTML</TITLE><meta name=“Author” content=“Maria Alice Soares de Castro(masc@icmc.sc.usp.br)”><META NAME=“Description” CONTENT=“Tutorial basico-avancado para suporte `aeditoracao de documentos Web.”><META NAME=“KeyWords” CONTENT=“HTML, WWW, Webpublishing”><META NAME=“Editor” CONTENT=“W3e - 5.22c”></HEAD>Alguns desses atributos são inseridos automaticamente pelos editores.Um exemplo de uso do atributo HTTP-EQUIV é promover a mudança automática de páginas.<HEAD><TITLE> ... </TITLE>APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 3 -
    • <META HTTP-EQUIV="Refresh" CONTENT="segundos; URL= pagina.html"></HEAD> onde:pagina.html é a página a ser carregada automaticamentesegundos é o número de segundos passados até que a página indicada seja carregada.Como foi comentado no exemplo, o efeito é interessante, mas para que serve? Se não pensamosem uma finalidade útil para esse efeito, caímos na tentação de usá-lo “à toa”.A aplicação mais utilizada é a atualização automática de um documento que, por exemplo, tenhauma foto produzida por uma câmara de vídeo: pode-se forçar, com o refresh, a atualização dessapágina, mostrando para o leitor sempre uma imagem mais atual de algum evento sendofocalizado pela câmara. Outra utilização é em “chats”, ou em páginas que desviem a navegaçãopor documentos desenvolvidos para browsers avançados.Atributos de <BODY>Através de atributos de <BODY>, podemos definir cores para os textos, links e para o fundo daspáginas, bem como uma imagem de fundo (marca d’água):<BODY BGCOLOR="#rrggbb" TEXT="#rrggbb" LINK="#rrggbb" ALINK="#rrggbb"VLINK="#rrggbb" BACKGROUND="URL">onde:BGCOLOR cor de fundo (padrão: cinza ou branco)TEXT cor dos textos da página (padrão: preto)LINK a cor dos links (padrão: azul)ALINK cor dos links, quando acionados (padrão: vermelho)VLINK cor dos links, depois de visitados (padrão: azul escuro ou roxo)Seus valores são dados em valores hexadecimais, equivalentes a cores no padrão RGB (Red,Green, Blue). Existem tabelas de cores com esses valores, mas grande parte dos editores jáoferece uma interface bem amigável através da qual escolhemos as cores desejadas, sem nospreocuparmos com números esdrúxulos tais como #FF80A0.Browsers que seguem a definição de HTML 3.2 também aceitam 16 nomes de cores, tirados dapaleta VGA do Windows - por exemplo, podemos escrever BGCOLOR="BLUE". Porém, browsersmais antigos não apresentarão as cores indicadas.Este documento tem a seguinte definição de atributos gerais:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 4 -
    • <BODY BGCOLOR="#FFFFFF" LINK="#008000" VLINK="#000000" ALINK="#FFFF00">BACKGROUND indica o URL da imagem a ser replicada no fundo da página, como uma marca d’água. Veja o exemplo de uma página cuja imagem de fundo é . CabeçalhosHá seis níveis de cabeçalhos em HTML, de <H1> a <H6>:<H1>Este é um cabeçalho de nível 1</H1><H2>Este é um cabeçalho de nível 2</H2><H3>Este é um cabeçalho de nível 3</H3><H4>Este é um cabeçalho de nível 4</H4><H5>Este é um cabeçalho de nível 5</H5><H6>Este é um cabeçalho de nível 6</H6>Esses cabeçalhos são mostrados da seguinte forma:Este é um cabeçalho de nível 1Este é um cabeçalho de nível 2Este é um cabeçalho de nível 3Este é um cabeçalho de nível 4Este é um cabeçalho de nível 5Este é um cabeçalho de nível 6Os cabeçalhos não podem ser aninhados, isto é:<H2>Este é <H1>um cabeçalho de nível 1</H1> dentro de um cabeçalho de nível2</H2>Embora em alguns browsers esse aninhamento possa dar um resultado (por exemplo,Este éum cabeçalho de nível 1dentro de um cabeçalho de nível 2), o aninhamento de cabeçalhos não é previsto pela definição de HTML.É bom notar que o título do documento não precisa ter necessariamente o mesmo texto docabeçalho principal.Os cabeçalhos têm atributos de alinhamento:<H2 ALIGN=CENTER>Cabeçalho centralizado</H2> Cabeçalho centralizado<H3 ALIGN=RIGHT>Cabeçalho alinhado à direita</H3>APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 5 -
    • Cabeçalho alinhado à direita<H4 ALIGN=LEFT>Cabeçalho alinhado à esquerda (default)</H4>Cabeçalho alinhado à esquerda (default) SeparadoresComo vimos no primeiro exemplo, as quebras de linha do texto fonte não são significativas naapresentação de documentos em HTML. Para organizar os textos, precisamos de separadores,apresentados aqui.Quebra de linhaQuando queremos mudar de linha, usamos o elemento <BR>. Isso só é necessário quandoqueremos uma quebra de linha em determinado ponto, pois os browsers já quebram as linhasautomaticamente para apresentar os textos.Com sucessivos <BR>, podemos inserir diversas linhas em branco nos documentos. Esseelemento tem um atributo especial, que será apresentado no item sobre inserção de imagens.ParágrafosPara separar blocos de texto, usamos o elemento <P>:Parágrafo 1;<P>Parágrafo 2.que produz:Parágrafo1;Parágrafo2.Combinando parágrafos e quebras de linha, temos:Parágrafo 1;<br> linha 1 do parágrafo 1, <br>linha 2 do parágrafo1.<P>Parágrafo 2;<br> linha 1 do parágrafo 2, <br>linha 2 do parágrafo 2.O resultado da marcação acima é:Parágrafo 1;linha 1 do parágrafo 1,linha 2 do parágrafo 1.Parágrafo 2;linha 1 do parágrafo 2,linha 2 do parágrafo 2.<P> tem atributo de alinhamento, como os cabeçalhos:<P ALIGN=CENTER>Assim como os trens, as boas idéias às vezes chegam comatraso. <BR>(Giovani Guareschi)</P>Assim como os trens, as boas idéias às vezes chegam com atraso.(Giovani Guareschi)<P ALIGN=RIGHT>Como diz o provérbio chinês: “É melhor passar por ignoranteuma vez do que permanecer ignorante para sempre”.</P>Como diz o provérbio chinês: “É melhor passar por ignorante uma vez do que permanecerignorante para sempre”.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 6 -
    • <P ALIGN=LEFT>Este é o alinhamento padrão (default), e por isso não voucolocar nenhuma frase especial.</P>Este é o alinhamento padrão (default), e por isso não vou colocar nenhuma frase especial.Linha Horizontal<HR> insere uma linha horizontal:Essa linha tem diversos atributos, oferecendo resultados diversos.<HR SIZE=7> insere uma linha de largura 7 (pixels):<HR WIDTH=50%> insere uma linha que ocupa 50% do espaço disponível:<HR WIDTH=30% ALIGN=RIGHT NOSHADE> insere uma linha de comprimento 30% (doespaço disponível), alinhada à direita, sem efeito tridimensional:<HR SIZE=30 WIDTH=2 ALIGN=LEFT> insere uma linha de largura 30, comprimento 2,alinhada à esquerda: Listas em HTMLHá vários tipos de listas em HTML, sendo estas as mais usadas e corretamente apresentadaspelos browsers:Listas de DefiniçãoEstas listas são chamadas também “Listas de Glossário”, uma vez que têm o formato:<DL><DT>termo a ser definido<DD>definição<DT>termo a ser definido<DD>definição</DL>Que produz:termo a ser definido definiçãotermo a ser definido definiçãoEste tipo de lista é muito utilizado para diversos efeitos de organização de páginas, por permitir atabulação do texto. Um exemplo são os índices de navegação presentes nas pági nas destetutorial; outro exemplo é a lista composta abaixo:<DL><DT>Imperadores do Brasil:<DD>D. Pedro I <DL>APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 7 -
    • <DD>Nome completo: Pedro de Alcântara Francisco Antônio João Carlos Xavier de Paula Miguel Rafael Joaquim José Gonzaga Pascoal Cipriano Serafim de Bragança e Bourbon </DL> <DD>D. Pedro II <DL> <DD>Nome completo: Pedro de Alcântara João Carlos Leopoldo Salvador Bibiano Francisco Xavier de Paula Leocádio Miguel Gabriel Rafael Gonzaga </DL> </DL> Imperadores do Brasil: D. Pedro I Nome completo: Pedro de Alcântara Francisco Antônio João Carlos Xavier de Paula Miguel Rafael Joaquim José Gonzaga Pascoal Cipriano Serafim de Bragança e Bourbon D. Pedro II Nome completo: Pedro de Alcântara João Carlos Leopoldo Salvador Bibiano Francisco Xavier de Paula Leocádio Miguel Gabriel Rafael GonzagaListas não-numeradasSão equivalentes às listas com marcadores do MS Word:<UL><LI>item de uma lista<LI>item de uma lista, que pode ser tão grande quanto se queira, sem que sejanecessário se preocupar com a formatação das margens de texto<LI>item</UL>  item de uma lista  item de uma lista, que pode ser tão grande quanto se queira, sem que seja necessário se preocupar com a formatação das margens de texto  item A diferença está na mudança dos marcadores, assinalando os diversos níveis de listas compostas: <UL> <LI>Documentos básicos <LI>Documentos avançados <UL> <LI>formulários <UL> <LI>CGI </UL> <LI>contadores APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 8 -
    • <LI>relógios </UL><LI>Detalhes sobre imagens</UL>  Documentos básicos  Documentos avançados  formulários  CGI  contadores  relógios  Detalhes sobre imagensSegundo o HTML 3.2, essa lista pode ter marcadores diferentes, indicados através do atributoTYPE, que assume os valores CIRCLE, SQUARE e DISC (default):<UL TYPE=CIRCLE><LI>um item<LI>mais um item</UL>  item um  mais um itemCada item também pode ter seu atributo específico:<UL><LI TYPE=DISC>um item<LI TYPE=CIRCLE>mais um item<LI TYPE=SQUARE>último item</UL>  um item mais um item último itemObservação 1: Boa parte dos editores HTML (WYSIWYG ou não), insere marcaçõesque não existem em listas. Exemplos típicos são </DD>, </DT> ; e </LI>. Porém, comoessas etiquetas não são reconhecidas pelos browsers, não causam efeito colateralalgum nos documentos.Observação 2: Nestes exemplos, o texto fonte aparece tabulado apenas para efeito demelhor visualização, uma vez que já foi visto que os espaços em branco e tabulaçõesoriginais não têm efeito no documento final.Observação 3: Se você não está vendo diferença alguma entre as listas comuns e asque têm atributos de HTML 3.2, isso se deve ao fato de seu browse r não estarreconhecendo esses atributos como válidos. Trata-se de um browser de versão antiga.Isso deve ser pensado quando usamos atributos mais recentes: nem todo usuáriopoderá ver o resultado das novas marca&cced il;ões.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 9 -
    • Listas Numeradas<OL><LI>item de uma lista numerada<LI>item de uma lista numerada, que pode ser tão grande quanto se queira, semque seja necessário se preocupar com a formatação das margens de texto<LI>item de lista numerada</OL> 1. item de uma lista numerada 2. item de uma lista numerada, que pode ser tão grande quanto se queira, sem que seja necessário se preocupar com a formatação das margens de texto 3. item de lista numeradaEstas listas não apresentam numeração em formato 1.1, 1.2 etc., quando compostas: 1. Documentos básicos 2. Documentos avançados 1. formulários 1. CGI 2. contadores 3. relógios 2. Detalhes sobre imagens Porém, através do atributo TYPE (HTML 3.2), pode-se lidar com a numeração dos itens: <OL TYPE=I> <LI>Documentos básicos <LI>Documentos avançados <OL TYPE=a> <LI >formulários <OL TYPE=i> <LI>CGI </OL> <LI>contadores <LI>relógios </OL> <LI>Detalhes sobre imagens </OL> I. Documentos básicos II. Documentos avançados a. formulários i. CGI b. contadores c. relógios III. Detalhes sobre imagens Ainda segundo HTML 3.2, o atributo START pode indicar o início da numeração da lista:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 10 -
    • <OL START=4 TYPE=A> <LI>um item <LI>outro item <LI>mais um item </OL> D. um item E. outro item F. mais um item Formatação de textos e caracteresHá dois tipos de formatação em HTML: lógico e físico. Os efeitos de apresentação na tela são osmesmos: o motivo da distinção entre eles se deve à idéia básica de independência entreespecificação e apresentação.Quando formatamos um trecho de texto como cabeçalho de nível 1, não explicitamos se esse tipode cabeçalho deve ser em alguma fonte determinada, em um tamanho determinado, justificado àesquerda ou à direita, ou centralizado. Esses detalhes de apresentação são deixados para obrowser - o dispositivo de apresentação do documento - que pode ser configurado de acordo como leitor (usuário final).Desse modo, além de facilitar enormemente o trabalho de quem escreve os documentos, alinguagem garante a uniformidade de apresentação de cabeçalhos, parágrafos, listas, etc.A formatação lógica segue o significado lógico do texto marcado: um endereço de e-mail, umacitação etc. Sua apresentação final varia conforme o browser, podendo oferecer resultados maisricos.A formatação física especifica explicitamente o estilo que se quer para o texto: itálico, grifadoetc. Sua apresentação final não sofre grandes variações. Blocos de textoHTML oferece as seguintes formatações de blocos de texto:<PRE>Apresenta o texto na mesma maneira em que foi digitado, mantendo quebras de linha etabulações:<pre>uma linha aqui,outra ali, etc.</pre>Resulta em:uma linha aqui,outra ali, etc.Uma vez que <PRE> mantém o texto original, não se deve forçar espaços com essa marcaçãodentro de outra marcação que já apresente tabulações e espaços específicos.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 11 -
    • Até o momento, somente como uso de <PRE> é possível gerar parágrafos com texto justificado àesquerda e à direita.<BLOCKQUOTE>É usado para citações longas:<blockquote>A massa do Sol arqueia o espaço-tempo de tal maneira que, aindaque a Terra siga uma trajetória reta no espaço-tempo quadridimensional,parece-nos que se desloca em órbita circular no espaçotridimensional.</blockquote> (Stephen W. Hawking, “Uma Breve História doTempo”) A massa do Sol arqueia o espaço-tempo de tal maneira que, ainda que a Terra siga uma trajetória reta no espaço-tempo quadridimensional, parece-nos que se desloca em órbita circular no espaço tridimensional.(Stephen W. Hawking, “Uma Breve História do Tempo”)<ADDRESS>Usado para formatar endereços E-mail e referências a autores de documentos:Envie críticas e sugestões para <address>masc@icmc.sc.usp.br </address> Formatação de frasesComo visto anteriormente (em Formatação de Textos e Caracteres), HTML permite dois tipos deformatação: lógico e físico; aqui veremos as formatações mais utilizadas:Estilos Lógicos<CITE>Para títulos de livros, filmes, e citações curtas. Exemplo: Assisti Guerra nas Estrelas umas oito vezes!<CODE>Para indicar trechos de código de programas. Exemplo: for (x=0); cl &&(!feof(stdin)); x++));<DFN>Indica definição de uma palavra, em geral apresenta o texto em itálico. Exemplo: CERN: Centre d’Éstudes et Recherches Nucleaires<EM>Ênfase, também normalmente apresentado em itálico. Exemplo: É preciso pesquisar muito para encontrar o termo exato.<KBD>Indica uma entrada via teclado. Exemplo:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 12 -
    • Para ler mensagens recebidas, digite pine -i<SAMP>Indica uma seqüência de caracteres, por exemplo uma mensagem de erro ou um resultado.Exemplo: O resultado do primeiro applet é: Hello, World!<STRONG>Forte ênfase, mostrado normalmente em negrito. Exemplo: Antes de enviar um e-mail, confira o campo “Subject:”!<VAR>Indica variáveis, ou valores que o usuário deverá escrever; geralmente mostrado em itálico.Exemplo: No campo Login, escreva guest.Estilos Físicos<B>Quando disponível no browser, é mostrado em negrito (em alguns browsers, pode aparecersublinhado)<I>Itálico (em alguns casos, caracteres apenas inclinados)<TT>Tipo teletype - fonte de espaçamento fixo.<U>Sublinhado; deve ser usado com cuidado, pois confunde-se com a apresentação de links.<STRIKE> ou <S>Frase riscada.<BIG>Fonte um pouco maior.<SMALL>Fonte um pouco menor.<SUB>Frase em estilo índice, como em H2O.<SUP>Frase em estilo expoente, como em Km2.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 13 -
    • Caracteres EspeciaisHTML permite que caracteres especiais sejam representados por sequências de escape, indicadaspor três partes: um & inicial, um número ou cadeia de caracteres correspondente ao caracterdesejado, e um ; final.Quatro caracteres ASCII - <, >, e & têm significados especiais em HTML, e são usados dentrode documentos seguindo a correspondência: Entidade Caracter &lt; < &gt; > &amp; & Outras seqüências de escape suportam caracteres ISO Latin1. Temos aqui uma tabela com os caracteres mais utilizados em Português: Entidade Caracter Entidade Caracter &aacute; á &Aacute; Á &acirc; â &Acirc; Â &agrave; à &Agrave; À &atilde; ã &Atilde; Ã &ccedil; ç &Ccedil; Ç &eacute; é &Eacute; É &ecirc; ê &Ecirc; Ê &iacute; í &Iacute; Í &oacute; ó &Oacute; Ó &ocirc; ô &Ocirc; Ô &otilde; õ &Otilde; Õ &uacute; ú &Uacute; Ú &uuml; ü &Uuml; Ü Como vemos, as sequências de escape são sensíveis à caixa.Ao usar caracteres acentuados, pode-se inserir uma indicação do esquema de codificação ISOLatin1, escrevendo:<HTML><HEAD><TITLE>...</TITLE><META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1"></HEAD>...APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 14 -
    • Cores e Fontes CoresAs cores são introduzidas através do elemento <FONT>, usando o sistema RGB para cores (damesma forma que vimos para cores de documentos):<FONT COLOR="#rrggbb">Texto</FONT>Assim, um trecho de texto pode ter uma cor diferente da definição geral de cores, feita atravésdos atributos de <BODY>.TamanhoA formatação<FONT SIZE=tamanho_da_letra>Texto</FONT>permite que o autor do documento altere o tamanho das letras em trechos específicos de texto. Otamanho básico dos textos é 3. Podemos indicar tamanhos relativos a esse, por exemplo:<FONT SIZE=+2>Letra maior</FONT>Letra normal<FONT SIZE=-2>Letra menor</FONT>Letra maior Letra normal Letra menorFontesUma evolução que permite a escolha da fonte para os textos, é o atributo FACE:<FONT FACE=fonte_da_letra>Texto</FONT>Por exemplo:<FONT FACE=Times COLOR="#0000AA">Fonte Times azul</FONT>Fonte Times azul<FONT FACE=Arial COLOR="#00AA00">Fonte Arial verde</FONT>Fonte Arial verde<FONT FACE=Courier COLOR="#AA0000">Fonte Courier vermelha</FONT>Fonte Courier vermelha MarqueeÉ possível obter o efeito de animação de texto, através da formatação <MARQUEE>.<MARQUEE BEHAVIOR=efeito>Texto</MARQUEE>Atributos de largura e direção do efeito permitem diversas apresentações diferentes. Por exemplo<MARQUEE BEHAVIOR=SCROLL WIDTH=30%>Texto</MARQUEE><MARQUEE BEHAVIOR=SLIDE DIRECTION=RIGHT>Texto</MARQUEE><MARQUEE BEHAVIOR=SLIDE DIRECTION=LEFT>Texto</MARQUEE>APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 15 -
    • Ligações (uso de links)Com HTML é possível fazermos ligações de uma região de texto (ou imagem) a um outrodocumento. Nestas páginas, temos visto exemplos dessas ligações: o browser destaca essasregiões e imagens do texto, indicando que são ligações de hipertexto - também chamadashypertext links ou hiperlinks ou simplesmente links.Para inserir um link em um documento, utilizamos a etiqueta <A>, da seguinte forma:<A HREF = "arq_dest">âncora</A>onde:arq_dest é o URL do documento de destino;âncora é o texto ou imagem que servirá de ligação hipertexto do documento sendo apresentado para o documento de destino. Caminhos para o documento de destinoCaminho relativoO caminho relativo pode ser usado sempre que queremos fazer referência a um documento queesteja no mesmo servidor do documento atual.Através do campo Location do browser, vemos que este documento está localizado em umdiretório /manuals/HTML/ do servidor www.icmc.sc.usp.br. Para escrevermos um link destedocumento para o documento doc2.html no diretório /manuals/HTML/exemplos, tudo queprecisamos fazer é escrever:Veja o <A HREF="exemplos/doc2.html">exemplo de caminho relativo</A>.que é apresentado como:Veja o exemplo de caminho relativo.Da mesma forma, se quisermos um link deste documento para um outro que esteja em diretóriodiferente neste mesmo servidor, escrevemos, por exemplo:<A HREF="/Portugues/ICMC/">Instituto de Ciências Matemáticas e deComputação</A>que produz o link: Instituto de Ciências Matemáticas e de ComputaçãoPara usar links com caminhos relativos é preciso, portanto, conhecer a estrutura do diretório doservidor no qual estamos trabalhando.O esquema do diretório de nosso servidor está disponível no Relatório no. 35 e no relatório doservidor Web (em final de preparação).APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 16 -
    • Caminho absolutoUtilizamos caminho absoluto quando desejamos referenciar um documento que esteja em outroservidor, por exemplo:<A HREF="http://www.intermidia.icmc.sc.usp.br/">Grupo Intermídia</A>que oferece um link para um documento no servidor WWW do Grupo de Pesquisa Intermídia:Grupo IntermídiaCom a mesma sintaxe, é possível escrever links para qualquer servidor de informações daInternet.Ligações para trechos de documentosAlém do atributo href, que indica um documento destino de uma ligação hipertexto, o elementoA possui um atributo NAME que permite indicar um trecho de documento como ponto de chegadade uma ligação hipertexto.Neste documento temos diversos parágrafos marcados como chegada de um link, por exemplo:<h3><A NAME="relativo">Caminho relativo</A></h3>que faz com que a âncora Caminho relativo seja o destino de um link. Se escrevermos:Leia sobre <A HREF="#relativo">caminhos relativos</A>.teremos uma ligação hipertexto para um trecho deste mesmo documento:Leia sobre caminhos relativos.Da mesma forma, construímos links para trechos determinados de outros documentos, desde quesaibamos quais trechos do documento destino estão marcados para ponto de chegada de um link.Por exemplo:São Carlos é um <A HREF= "/Portugues/Sao_Carlos/histprog.html#polo">pólo dealta tecnologia</A>.que produz um link para um parágrafo marcado no arquivo histprogr.html sobre a cidade deSão Carlos, no diretório /Portugues/Sao_Carlos/:São Carlos é um pólo de alta tecnologia. Inserção de ImagensO elemento IMG insere imagens que são apresentadas junto com os textos. Um atributo SRCdeve estar presente, da seguinte forma:<IMG SRC="URL_imagem">onde URL_imagem é o URL do arquivo que contém a imagem que se quer inserir; pode serreferenciada uma imagem que esteja em um outro servidor (o que, logicamente, não éconveniente).Assim, escrevendo:<IMG SRC = "/icones/newred.gif">inserimos a figura no documento.As imagens usadas na Web são armazenadas em arquivos com extensão *.gif, *.xbm, *.jpg(ou *.jpeg).APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 17 -
    • Atributos básicosALTIndica um texto alternativo, descrevendo brevemente a imagem, que é apresentado no lugar daimagem nos browsers texto, ou quando se desabilita o carregamento de imagens em browsersgráficos. É recomendável que esteja sempre presente.<IMG SRC="URL_imagem" ALT="descrição_da_imagem">WIDTH e HEIGHTAtributos de dimensão da imagem, em pixels. Grande parte dos editores HTML colocaautomaticamente os valores destes atributos, quando indicamos a inserção de uma imagem.<IMG SRC="imagem" ALT="descrição" WIDTH="largura" HEIGHT="altura">Uma das vantagens de se usar esses atributos é que o browser pode montar mais rapidamente aspáginas, por saber de antemão o espaço que deverá ser reservado a elas.BORDERQuando uma frase é marcada como âncora de um link, ela se apresenta sublinhada; quando umaimagem faz as vezes de âncora, ganha uma borda que indica sua condição. Por exemplo: bordaPorém, por questões de apresentação, nem sempre interessa termos essa borda ao redor daimagem. Assim, com o atributo BORDER, podemos controlar esse detalhe.Se quisermos uma borda maior... borda<A HREF="URL"><IMG SRC="imagem" ALT="descrição" BORDER=4></A>Se quisermos uma imagem sem borda... borda<A HREF="URL"><IMG SRC="imagem" ALT="descrição" BORDER=0></A>ALIGN<IMG SRC="imagem" ALT="descrição" ALIGN=alinhamento>Existem também atributos de alinhamento, que produzem os seguintes resultados:ALIGN=TOP Alinha o texto adjacente com o topo da imagem, embora com linhas compridas oresultado não seja muito bom.ALIGN=MIDDLE Alinha o texto adjacente com o meio da imagem, embora com linhascompridas o resultado não seja muito bomALIGN=BOTTOM Alinha o texto adjacente com a parte de baixo da imagem (default)ALIGN=RIGHT Alinha imagem à direita, e tudo o que houver ao redor (texto, outrasimagens) a partir do topo da imagem.ALIGN=LEFT Alinha imagem à esquerda, e tudo o que houver ao redor (texto, outras imagens)a partir do topo da imagem.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 18 -
    • Molduras de imagemPara melhorar ainda mais a apresentação das imagens junto com os textos, foram desenvolvidosatributos de moldura. Estes atributos definem o espaço - vertical e horizontal - deixado entre asimagens e os textos circundantes: <IMG SRC="imagem" VSPACE=esp_vertical> <IMG SRC="imagem" HSPACE=esp_horizontal> TabelasA formatação de tabelas foi adotada bem antes de sua inclusão na definição de HTML. Amanipulação de tabelas, mesmo em editores, é trabalhosa; a maior diferença entre tabelas emHTML e em edit ores como o MS Word, entretanto, é o fato das tabelas em HTML seremdefinidas apenas em termos de linhas e não de colunas. Mas isso será percebido no decorrerdestas páginas.As tabelas foram uma grande conquista para os autores de documentos para a Web. Com elas épossível, por exemplo, termos estas páginas do tutorial organizadas em colunas, sendo uma delasvoltada exclusivamente aos links de navega&cced il;ão e observações. Tabelas implementam umconceito importante de layout: as “grades”, segundo as quais organizamos textos e ilustrações demaneira harmoniosa.Como já foi possível perceber, as tabelas contêm textos, listas, parágrafos, imagens, diversasoutras formatações - inclusive outras tabelas. Novas versões de HTML e de browsers popularesvêm acrescentando diversos atributos às tabelas, e nosso objetivo aqui é saber lidar com amaioria desses recursos disponíveis. Elementos básicos de tabelas<TABLE>...</TABLE> delimita uma tabela. Um atributo básico é BORDER, que indica aapresentação da borda.<TABLE BORDER="borda">...</TABLE>Títulos, linhas e elementos<CAPTION>...</CAPTION> define o título da tabela<TR>...</TR> delimita uma linha<TH>...</TH> define um cabeçalho para colunas ou linhas (dentro de <TR>)<TD>...</TD>APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 19 -
    • delimita um elemento ou célula (dentro de <TR>)Uma tabela simples:<TABLE BORDER=4><CAPTION>Primeiro exemplo</CAPTION><TR><TH>Coluna 1</TH><TH>Coluna 2</TH></TR><TR><TD>linha1, coluna 1</TD><TD> linha 1, coluna 2</TD></TR><TR><TD>linha 2, coluna 1</TD><TD>linha 2, coluna 2</TD></TR></TABLE>Primeiro exemplo Coluna 1 Coluna 2linha1, coluna 1 linha 1, coluna 2linha 2, coluna 1 linha 2, coluna 2Títulos compreendendo mais de uma coluna ou linhaÉ possível englobar colunas e linhas, através dos atributos COLSPAN (para colunas) eROWSPAN (para linhas):<TABLE BORDER=1><TR><TH COLSPAN=2>Colunas 1 e 2</TH></TR><TR><TD>linha1, coluna 1</TD><TD> linha 1, coluna 2</TD></TR><TR><TD>linha 2, coluna 1</TD><TD>linha 2, coluna 2</TD></TR><TR><TH ROWSPAN=3>3 linhas</TH><TD>uma linha</TD></TR><TR><TD>duas linhas</TD></TR><TR><TD>tres linhas</TD></TR></TABLE> Colunas 1 e 2linha1, coluna 1 linha 1, coluna 2linha 2, coluna 1 linha 2, coluna 2 uma linha 3 linhas duas linhas tres linhasNeste exemplo, vemos que o cabeçalho Colunas 1 e 2 compreende duas colunas (COLSPAN=2); ocabeçalho 3 linhas compreende, por sua vez, 3 linhas (ROWSPAN=3).Tabelas sem bordaAs páginas deste tutorial foram construídas com tabelas sem borda. Para tanto, foi empregada aseguinte delaração:<TABLE BORDER="0">...</TABLE>APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 20 -
    • Alinhamentos em tabelastabelas: O Instituto de Ciências Matemáticas de São Carlos (ICMSC-USP) é formado pelos Departamentos de Matemática e de Ciências de Computação e Estatística.Prédio principal do ICMSC-USP O ICMSC originou-se em 1953, como Departamento de Matemática da Escola de Engenharia de São Carlos (EESC-USP), fundado por renomados matemáticos italianos e brasileiros. Atualmente, o Departamento de Matemática oferece cursos de Licenciatura e Bacharelado em Matemática emDepartamento de nível de graduação, além de um programa de pós-Matemática (SMA) graduação que inclui mestrado e doutorado na área de Matemática. O Departamento de Computação e Estatística é responsável pelo curso de Bacharelado em Ciência deDepartamento de Computação, no qual ingressam 40 alunos por ano. EmComputação e Estatística nível de pós-graduação oferece, desde 1975, o programa(SCE) de mestrado em Ciências de Computação e Matemática Computacional e, a partir de agosto de 1995, o programa de doutorado na mesma área.Para maiores informações: Cursos de Graduação: "grad@icmsc.sc.usp.br Cursos de Pós-Graduação: "posgrad@icmsc.sc.usp.brO conteúdo é informativo, porém a apresentação não é agradável devido à disposição do texto natabela.Primeiro, vamos mexer com os alinhamentos.Alinhamentos simplesOs alinhamentos padrão em tabelas, como podemos ver no exemplo acima, são: no sentido horizontal: alinhamento à esquerda no sentido vertical: alinhamento no centro da célulaAs linhas e células podem ter alinhamentos definidos através dos atributos: ALIGN = alin_horizontal VALIGN = alin_verticalVejamos como esses alinhamentos funcionam nas células: <TD ALIGN=alin_horizontal>Texto da célula</TD> <TD VALIGN=alin_vertical>Texto da célula</TD>APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 21 -
    • Padrão ALIGN=LEFT ALIGN=CENTER ALIGN=RIGHT VALIGN=TOPPadrão VALIGN=MIDDLE VALIGN=BOTTOMObs.: a tabela acima foi feita especialmente para testar os alinhamentos. Uma tabela comumajusta o tamanho de suas células ao conteúdo:Padrão align=left align=center align=rightPadrão valign=top valign=middle valign=bottomAlinhamentos combinadosUma mesma célula pode ter atributos ALIGN e VALIGN. <TD ALIGN=alin_horizontal VALIGN=alin_vertical>Texto da célula</TD>Por exemplo:Padrão ALIGN=CENTER, ALIGN=RIGHT, ALIGN=LEFT, VALIGN=TOP VALIGN=MIDDLE VALIGN=BOTTOMAlinhamentos de linhasO alinhamento pode ser aplicado a linhas inteiras, com: <TR ALIGN=alin_horizontal VALIGN=alin_vertical>Texto da célula</TR>Porém, o alinhamento declarado em uma célula prevalece sobre o alinhamento da linha, como sevê no exemplo:center center center TD ALIGN=RIGHT TD VALIGN=TOP bottom bottombottomIsso pode ser interessante para algumas aplicações.Já conseguimos mexer um pouco na tabela inicial, inserindo alinhamentos combinados; serãonecessários mais alguns passos para que a tabela fique realmente "apresentável" - o exemplocontinua nas seções sobre larguras e espaçamentos.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 22 -
    • Prédio principal do ICMSC-USP O Instituto de Ciências Matemáticas de São Carlos (ICMSC-USP) é formado pelos Departamentos de Matemática e de Ciências de Computação e Estatística. O ICMSC originou-se em 1953, como Departamento de Matemática da Escola de Engenharia de São Carlos (EESC-USP), fundado por renomados matemáticos italianos e brasileiros.Departamento de Atualmente, o Departamento de Matemática ofereceMatemática (SMA) cursos de Licenciatura e Bacharelado em Matemática em nível de graduação, além de um programa de pós- graduação que inclui mestrado e doutorado na área de Matemática.Departamento de O Departamento de Computação e Estatística éComputação e Estatística responsável pelo curso de Bacharelado em Ciência de(SCE) Computação, no qual ingressam 40 alunos por ano. Em nível de pós-graduação oferece, desde 1975, o programa de mestrado em Ciências de Computação e Matemática Computacional e, a partir de agosto de 1995, o programa de doutorado na mesma área.Para maiores informações: Atributos de larguraNa seção anterior, foi comentado que uma tabela comum ajusta o tamanho de suas células aoconteúdo. Por exemplo:janeiro fevereiro marçoabril maio junhoPara apresentar uma tabela ocupando determinado espaço disponível na linha, usamos o atributoWIDTH. Esse atributo pode ser aplicado também a linhas e células.Essa largura pode ser definida em porcentagem (do espaço disponível): WIDTH=x%ou em pixels: WIDTH=xEx.1: Tabela ocupando 50% do espaço disponível<TABLE BORDER=1 width=50%>janeiro fevereiro marçoabril maio junhoAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 23 -
    • Ex.2: Tabela ocupando 50% do espaço disponível, com uma coluna de 60% do espaçodisponível na tabela<TABLE BORDER=1 width=50%><TR> <TD>janeiro</TD><TD width=60%>fevereiro</TD><TD>março</TD></TR><TR> <TD>abril</TD><TD width=60%>maio</TD><TD>junho</TD></TR></TABLE>janeiro fevereiro marçoabril maio junhoEx3.: O controle da largura da tabela está limitado à dimensão de seu conteúdo:<TABLE BORDER=1 width=50%><TR> <TD>janeiro</TD><TD width=1%>fevereiro</TD><TD>março</TD></TR><TR> <TD>abril</TD><TD width=1%>maio</TD><TD>junho</TD></TR></TABLE>janeiro fevereiro marçoabril maio junhoAlguns editores WYSIWYG não trabalham com atributos de largura. Nestes casos, épreciso editar o arquivo fonte.De volta ao exemplo inicial, já podemos melhorar um pouco mais nossa tabela. Mantendo osalinhamentos definidos na seção anterior, aplicaremos atributos de largura:Prédio principal do ICMSC-USP O Instituto de Ciências Matemáticas de São Carlos (ICMSC- USP) é formado pelos Departamentos de Matemática e de Ciências de Computação e Estatística. O ICMSC originou-se em 1953, como Departamento de Matemática da Escola de Engenharia de São Carlos (EESC- USP), fundado por renomados matemáticos italianos e brasileiros.Departamento de Atualmente, o Departamento de Matemática oferece cursos deMatemática (SMA) Licenciatura e Bacharelado em Matemática em nível deAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 24 -
    • graduação, além de um programa de pós-graduação que inclui mestrado e doutorado na área de Matemática.Departamento de O Departamento de Computação e Estatística é responsávelComputação e pelo curso de Bacharelado em Ciência de Computação, noEstatística (SCE) qual ingressam 40 alunos por ano. Em nível de pós-graduação oferece, desde 1975, o programa de mestrado em Ciências de Computação e Matemática Computacional e, a partir de agosto de 1995, o programa de doutorado na mesma área.Para maiores informações: Cursos de Graduação: "grad@icmsc.sc.usp.br Cursos de Pós-Graduação: "posgrad@icmsc.sc.usp.brAinda faltam detalhes. Um deles é evitar que o texto fique grudado nas bordas da tabela;veremos na próxima seção, sobre espaçamentos Atributos de espaçamentoDois atributos permitem o controle de espaçamento em tabelas: CELLPADDING - espaço entre o texto e as bordas da célula CELLSPACING - espaço entre célulasTomemos a mesma tabela simples da seção anterior:janeiro fevereiro marçoabril maio junhoEx.1: Espaço entre o texto e as bordas<TABLE BORDER=1 CELLPADDING=20> ma janeiro fevereiro rço jun abril maio hoEx.2: Espaço entre células<TABLE BORDER=1 CELLSPACING=20>janeiro fevereiro marçoabril maio junhoAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 25 -
    • Ex3.: Espaço entre texto e bordas, e espaço entre células<TABLE BORDER=1 CELLPADDING=20 CELLSPACING=20> ma janeiro fevereiro rço jun abril maio ho<HREF=".HTML"Folhas de Estilo<HREF=".HTML"HTML dinâmicoAssim, damos mais uma mexida na tabela inicial: Prédio principal do ICMSC-USP O Instituto de Ciências Matemáticas de São Carlos (ICMSC- USP) é formado pelos Departamentos de Matemática e de Ciências de Computação e Estatística. O ICMSC originou-se em 1953, como Departamento de Matemática da Escola de Engenharia de São Carlos (EESC- USP), fundado por renomados matemáticos italianos e brasileiros. Departamento de Atualmente, o Departamento de Matemática oferece cursos Matemática (SMA) de Licenciatura e Bacharelado em Matemática em nível de graduação, além de um programa de pós-graduação que inclui mestrado e doutorado na área de Matemática. Departamento de O Departamento de Computação e Estatística é responsável Computação e pelo curso de Bacharelado em Ciência de Computação, no Estatística (SCE) qual ingressam 40 alunos por ano. Em nível de pós- graduação oferece, desde 1975, o programa de mestrado em Ciências de Computação e Matemática Computacional e, a partir de agosto de 1995, o programa de doutorado na mesma área. Para maiores informações: Cursos de Graduação: "grad@icmsc.sc.usp.br Cursos de Pós-Graduação: "posgrad@icmsc.sc.usp.brComo toque final, retiramos a borda:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 26 -
    • O Instituto de Ciências Matemáticas de São Carlos (ICMSC- Prédio principal do ICMSC-USP USP) é formado pelos Departamentos de Matemática e de Ciências de Computação e Estatística. O ICMSC originou-se em 1953, como Departamento de Matemática da Escola de Engenharia de São Carlos (EESC- USP), fundado por renomados matemáticos italianos e brasileiros. Departamento de Atualmente, o Departamento de Matemática oferece cursos Matemática (SMA) de Licenciatura e Bacharelado em Matemática em nível de graduação, além de um programa de pós-graduação que inclui mestrado e doutorado na área de Matemática. Departamento de O Departamento de Computação e Estatística é responsável Computação e pelo curso de Bacharelado em Ciência de Computação, no Estatística (SCE) qual ingressam 40 alunos por ano. Em nível de pós- graduação oferece, desde 1975, o programa de mestrado em Ciências de Computação e Matemática Computacional e, a partir de agosto de 1995, o programa de doutorado na mesma área. Para maiores informações: Cursos de Graduação: "grad@icmsc.sc.usp.br Cursos de Pós-Graduação: "posgrad@icmsc.sc.usp.brAgora já vimos grande parte dos recursos disponíveis para manipular tabelas, que permitemproduzir bons efeitos de apresentação. Extensões de Tabelas Diversas extensões de tabelas possibilitam a apresentação de efeitos muito bons nas páginas.Cor de fundo<TABLE BORDER=5 CELLSPACING=5 CELLPADDING=10 BGCOLOR="#E1FFD9"> janeiro fevereiro março abril maio junhoCor de borda<TABLE BORDER=5 CELLSPACING=5 CELLPADDING=10 BGCOLOR="#E1FFD9"BORDERCOLOR="#00FF00"> janeiro fevereiro março abril maio junho<HREF=".HTML"Folhas de EstiloAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 27 -
    • <HREF=".HTML"HTML dinâmicoImagem de fundo<TABLE BORDER=5 BACKGROUND="imagem"> janeiro fevereiro março abril maio junho FormuláriosUm formulário é um modelo para a entrada de um conjunto de dados. O primeiro passo parafazer formulários é aprender as etiquetas que desenham as janelinhas de entrada de dados, paradepois trabalharmos com os scripts, que são os programas que tratam esses dados, oferecendo osserviços desejados (acesso a banco de dados, envio de e-mail, etc.).O elemento <FORM> delimita um formulário e contém uma seqüência de elementos de entrada ede formatação do documento.<FORM ACTION="URL_de_script" METHOD=método>...</FORM>Os atributos de FORM que nos interessam agora são:ACTION Especifica o URL do script ao qual serão enviados os dados do formulário.METHOD Seleciona um método para acessar o URL de ação. Os métodos usados atualmente são GET e POST. Ambos os métodos transferem dados do browser para o servidor, com a seguinte diferença básica:  POST - os dados entrados fazem parte do corpo da mensagem enviada para o servidor; - transfere grande quantidade de dados.  GET - os dados entrados fazem parte do URL associado à consulta enviada para o servidor; - suporta até 128 caracteres.FORM também pode apresentar o atributo:ENCTYPEIndica o tipo de codificação dos dados enviados através do formulário. O tipo default éapplication/x-www-form-urlencoded. Outro tipo aceito por alguns browsers é text/plain,m as sua utilização ainda não está padronizada.Os formulários podem conter qualquer formatação - parágrafos, listas, tabelas, imagens - excetooutros formulários. Em especial, colocamos dentro da marcação de <FORM> as formatações paracampos de entrada de dados, que são três: <INPUT>, <SELECT> e <TEXTAREA>.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 28 -
    • Todos os campos de entrada de dados têm um atributo NAME, ao qual associamos um nome,utilizado posteriormente pelo script. São os scripts que organizam esses dados de entrada em umconjunto de informações significativas para determinado propósito. Primeiro vamos ver os tiposde campos para montar um formulário, e depois passaremos aos scripts. INPUTO campo <INPUT> tem um atributo TYPE, ao qual atribuímos seis valores diferentes para gerarseis tipos diferentes de entrada de dados.Campo de dados textoQuando INPUT não apresenta atributos, é assumido TYPE=TEXT (default); a formatação: <FORM> Nome: <INPUT TYPE=TEXT NAME="Nome"> </FORM>ou apenas: <FORM> Nome: <INPUT NAME="Nome"> </FORM>produz o resultado:Nome:Campo de dados senhaEntrada de texto na qual os caracteres são escondidos por asteriscos, como se pode ver noexemplo. <FORM> Login: <INPUT TYPE=TEXT NAME=login><br> Password: <INPUT TYPE=PASSWORD NAME="senha"> </FORM> mascLogin:Password:Alguns atributosVALUE pode ser usado para dar um valor inicial a um campo de tipo texto ou senha. Dessemodo, se o usuário não preencher este campo, será adotado este valor padrão. Se o usuário quiserentra r dados, ele somente precisará apagar o que já estiver escrito.Nome: <INPUT TYPE=TEXT NAME="nome" VALUE="Seu nome"> Seu nomeNome:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 29 -
    • SIZE especifica o tamanho do espaço no display para o campo do formulário. Só é válido paracampos TEXT e PASSWORD. O valor default (padrão) é 20. <FORM> Endereço: <INPUT TYPE=TEXT SIZE=35> </FORM>Endereço:MAXLENGHT é o número de caracteres aceitos em um campo de dados; este atributo só é válidopara campos de entrada TEXT e PASSWORD. <FORM> Dia do mês: <INPUT TYPE=TEXT NAME="ex" MAXLENGHT=2> </FORM>produz o resultado:Dia do mês:Apenas 2 caracteres serão lidos pelo formulário, não importa o quanto se escreva neste campo.Múltipla escolhaCHECKBOX insere um botão para escolha de opções. A cada alternativa corresponde um valor a sermanipulado pelo script que processa os dados. Pode ser escolhida mais de uma alternativa.<INPUT TYPE=CHECKBOX NAME="esporte" VALUE="basquete">Basquete <br ><INPUT TYPE=CHECKBOX NAME=esporte VALUE=bocha>BochaUma diretiva CHECKED marca uma escolha inicial, isto é, se o usuário não escolher nenhumaopção, o formulário irá considerar a alternativa "pré-escolhida":<INPUT TYPE=CHECKBOX NAME="esporte" VALUE="volei" CHECKED& gt;Vôlei<br><INPUT TYPE=CHECKBOX NAME="esporte" VALUE="futebol">FutebolEsportes que você pratica: futebol Futebol volei Vôlei natacao Natação basquete Basquete tenis Tênis bocha BochaEscolha únicaRADIO insere um botão de escolha de valores para uma opção, isto é, somente uma alternativapode ser escolhidaAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 30 -
    • <INPUT TYPE=RADIO NAME="time" VALUE="palm">Palmeiras <br><INPUT TYPE=RADIO NAME="time" VALUE="inte">InternacionalUma diretiva CHECKED marca uma escolha inicial - se o usuário não escolher nenhuma opção, oformulário irá considerar a alternativa "pré-escolhida":<INPUT TYPE=RADIO NAME="time" VALUE="aea" CHECKED>AEA <br><INPUT TYPE=RADIO NAME="time" VALUE="naut">NáuticoSeu time do coração: palm naut flam grem Palmeiras; Náutico; Flamengo; Grêmio; sant atle cori flum Santos; Atlético; Corinthians; Fluminense; inte cruz bota sant Internacional; Cruzeiro; Botafogo; Santa saop aeaCruz; São Paulo; AEA.Botões de açãoSUBMIT apresenta o botão que causa o envio dos dados de entrada para o servidor; <FORM> <INPUT TYPE=SUBMIT> </FORM> Enviar consulÉ possível modificar a mensagem desse botão através do atributo VALUE <FORM> <INPUT TYPE=SUBMIT VALUE="Envia mensagem"> </FORM> EnviaRESET restaura os valores iniciais das entradas de dados. <FORM> <INPUT TYPE=RESET> </FORM> RedefinirÉ possível modificar a mensagem desse botão através do atributo VALUE <FORM> <INPUT TYPE=RESET VALUE="Apaga tudo!"> </FORM> Apaga tudo! SELECT e TEXTAREAAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 31 -
    • <SELECT> apresenta uma lista de valores, através de campos OPTION.<SELECT NAME="sabor"><OPTION>Abacaxi<OPTION>Creme<OPTION>Morango<OPTION>Chocolate</SELECT> AbacaxiTambém é possível estabelecer uma escolha-padrão, através do atributo SELECTED<SELECT NAME="sabor"><OPTION>Abacaxi<OPTION SELECTED>Creme<OPTION>Morango<OPTION>Chocolate</SELECT> CremeCom o atributo SIZE, escolhe-se quantos itens da lista serão mostrados (no exemplo, SIZE=4): Abacaxi Creme Morango Chocolate<TEXTAREA> abre uma área para entrada de texto, de acordo com atributos para número decolunas, linhas, e - se for o caso - um valor inicial.<TEXTAREA COLS=40 ROWS=5 NAME="comentario"> Deixe seu comentário </TEXTAREA> Deixe seu comentário Submissão de FormuláriosSuponhamos um formulário cuja marcação principal seja: <FORM ACTION="/cgi-bin/masc/manual" METHOD=método> ... </FORM>onde ACTION indica o URL do script que receberá os dados (ainda não vamos nos preocupar como campo METHOD)APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 32 -
    • Vejamos o que ocorre quando acionamos o botão de SUBMIT desse formulário: o browser prepara a requisição, organizando os dados do formulário em pares nome-valor, onde: nome foi definido nas etiquetas do formulário (pelo atributo NAME); valor é a entrada oferecida pelo usuário. No script, esses valores serão armazenados em uma estrutura deste tipo: typedef struct { char *name char *val; } entry; O único detalhe diferente na manipulação da entrada dos dados no script é a necessidade de decodificá-los.Por exemplo, um campo do tipo... <INPUT TYPE=TEXT NAME="nome">cuja entrada tenha sido... Prof. Achilleserá organizado pelo browser da seguinte forma: nome=Prof.+Achille+BassiSe o formulário tiver mais campos, por exemplo: <INPUT TYPE=TEXT NAME="email">com uma entrada bassi@icmsco browser estará gerando uma linha semelhante a:nome=Prof.+Achille+Bassi& email=bassi@icmsc.sc.usp.brNote que os campos de informação são separados por &. Também todos os acentos e símbolosespeciais são codificados em hexadecimal para o envio dos dados. Esta codificação dos dados de umformulário é padrão.Para testar como é feita a codificação dos dados de um formulário com vários campos, entre seu e-mail no campo abaixo; ele será usado para enviar uma mensagem para você mesmo (se o e-mailusado no teste for inválido, não será possível realizar o teste corretamente): Testa exemplo ApagaO browser envia a requisição para o URL indicado em ACTION, que está associado a um script. Umadas funções do script será separar os campos de informação (retirar os &) e "limpar" os dados dossinais de + e símbolos hexadecimais.No exemplo (se você testou), foi possível ver uma entrada "suja", pois em vez de script foi usado omailto para ACTION.Uma forma de ter uma mensagem "limpa" com a entrada de formulários é declarar a codificaçãotext/plain. O detalhe é que essa codificação não é ainda padronizada. Você pode testar se seubrowser aceita esse formato ao submeter formulários, através de um segundo exemplo, bastandoentrar no campo abaixo o seu e-mail: Testa exemplo Apaga APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 33 -
    • Métodos de HTTPO protocolo HTTP utiliza vários métodos de manipulação e organização dos dados. Atualmente,dois métodos são mais utilizados para submeter dados de formulários: POST e GET. A diferençaentre estes métodos é a seguinte:POST  com POST, os dados entrados pelo formulário fazem parte do corpo da mensagem enviada para o servidor;  a cadeia de caracteres de entrada é lida como entrada padrão de comprimento CONTENT_LENGTH;  é possível transferir grande quantidade de dados.GET  com GET, os dados de entrada do script fazem parte do URL associado à consulta enviada para o servidor (por exemplo, nas consultas a catálogos do tipo Yahoo e Surf);  a cadeia de entrada é colocada na variável de ambiente QUERY_STRING;  suporta somente até 128 caracteres;  como os dados da consulta fazem parte do URL, ela pode ser encapsulada em um URL de link ou bookmark;  um detalhe é que os dados de entrada são copiados no regsitro de acessos ao site; portanto, informações que exigem segurança não devem ser manipuladas por este método. Métodos de HTTPO protocolo HTTP utiliza vários métodos de manipulação e organização dos dados. Atualmente,dois métodos são mais utilizados para submeter dados de formulários: POST e GET. A diferençaentre estes métodos é a seguinte:POST  com POST, os dados entrados pelo formulário fazem parte do corpo da mensagem enviada para o servidor;  a cadeia de caracteres de entrada é lida como entrada padrão de comprimento CONTENT_LENGTH;  é possível transferir grande quantidade de dados.GET  com GET, os dados de entrada do script fazem parte do URL associado à consulta enviada para o servidor (por exemplo, nas consultas a catálogos do tipo Yahoo e Surf);  a cadeia de entrada é colocada na variável de ambiente QUERY_STRING;  suporta somente até 128 caracteres;  como os dados da consulta fazem parte do URL, ela pode ser encapsulada em um URL de link ou bookmark;  um detalhe é que os dados de entrada são copiados no regsitro de acessos ao site; portanto, informações que exigem segurança não devem ser manipuladas por este método.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 34 -
    • Além de procurarmos lidar sempre com pequenos trechos de áudio e vídeo, podemos explorartecnologias recentes que permitem a transmissão em tempo real ÁudioHá duas maneiras de inserir som em uma página:- para browsers Netscape: <EMBED SRC="audio.som">- para browsers Internet Explorer: <BGSOUND SRC="audio.som">Essas formatações, porém, não farão efeito algum quando o browser não estiver configuradopara "tocar" música, ou se o computador que receber a página não tiver uma placa de som.É possível configurar a apresentação do arquivo de som, como veremos nos próximos passos... VídeoEm geral, embutimos um arquivo de video em um documento desta maneira <EMBED SRC="video.vid">Essa formatação, porém, não fará efeito algum quando o browser não estiver configurado para"tocar" o vídeo. Quando usar GIF e quando usar JPEGPara alguns tipos de imagens, o formato GIF é superior em qualidade de imagem, tamanho dearquivo, ou ambos. O que precisamos saber é para que tipo de imagens devemos aplicar JPEG.De maneira geral, JPEG é melhor aplicado a imagens com variações de cor - fotografiasdigitalizadas, por exemplo - coloridas ou com no mínimo 16 níveis em tons de cinza. Quantomais complexa a imagem, melhor o resultado com JPEG.GIF é melhor para imagens com cores lisas (bordas, áreas com cores "puras") realizando, nessescasos, uma compressão muito melhor do que JPEG faria. Nestes casos, JPEG produz imagensdesfocadas. Por isso, imagens em preto-e-branco puros (sem tons de cinza) não devem serprocessados em JPEG.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 35 -
    • Introdução ao JavaScriptJavaScript é uma linguagem que permite injetar lógica em páginas escritas em HTML(HiperText Mark-up Language). As páginas HTML podem ser escritas utilizando-se editores detexto, como o NotePad, Write, etc. Porém, existem editores próprios para gerar HTML, taiscomo HotDog e (mais recomendado) Microsoft FrontPage.Os parágrafos de lógica do javaScript podem estar "soltos" ou atrelados a ocorrência de eventos.Os parágrafos soltos são executados na seqüência em que aparecem na página (documento) e osAtrelados a eventos são executados apenas quando o evento ocorre. Para inserir parágrafos deprogramação dentro do HTML é necessário identificar o início e o Fim do set de JavaScript, daseguinte forma:<SCRIPT>Set de instruções</SCRIPT>Este procedimento pode ser adotado em qualquer local da página. Entretanto, para melhorvisualização e facilidade de manutenção, recomenda-se que toda a lógica seja escrita no início dodocumento, através da criação de funções a serem invocadas quando se fizer necessário(normalmente atreladas a eventos).Se a lógica é escrita a partir de um determinado evento, não é necessário o uso dos comandos<SCRIPT> e </SCRIPT>.Os comandos JavaScript são sensíveis ao tipo de letra (maiúsculas e minúsculas) em sua sintaxe.Portanto, é necessário que seja obedecida a forma de escrever os comandos, de acordo com aforma apresentada ao longo deste manual. Caso seja cometido algum erro de sintaxe quando daescrita de um comando, o JavaScript interpretará, o que seria um comando, como sendo o nomede uma variável. OPERADORES LÓGICOSSão operadores a serem utilizados em comandos condicionais, tais como: IF , FOR e WHILE.Os comandos condicionais serão vistos mais a frente.= = Igual!= Diferente> Maior>= Maior ou Igual< Menor<= Menor ou Igual&& EAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 36 -
    • OPERADORES MATEMÁTICOSSão operadores a serem utilizados em cálculos, referências de indexadores e manuseio de strings.Ao longo do manual estes operadores serão largamente utilizados, dando, assim, uma noção maisprecisa do seu potencial.+ adição de valor e concatenação de strings- subtração de valores* multiplicação de valores/ divisão de valores% obtém o resto de uma divisão:+= concatena /adiciona ao string/valor já existente. Ou seja:x +=y é o mesmo que x = x + yda mesma forma podem ser utilizados: -= , *= , /= ou %=Um contador pode ser simplificado utilizando-se :X++ ou X-- o que equivale as expressões:X = X + 1 ou X = X - 1 respectivamente. Para inverter sinal: X = -X negativo para positivo ou positivo para negativo. CONTROLES ESPECIAISb - backspacef - form feedn - new line caractersr - carriage returnt - tab characters// - Linha de comentário/*....*/ - Delimitadores para inserir um texto com mais de uma linha como comentário.Os delimitadores naturais para uma string são " ou . Caso seja necessário a utilização destescaracteres como parte da string, utilize precedendo " ou .Ex. alert ("Cuidado com o uso de " ou em uma string") COMANDOS CONDICIONAISSão comandos que condicionam a execução de uma certa tarefa à veracidade ou não de umadeterminada condição, ou enquanto determinada condição for verdadeira.São eles:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 37 -
    • Comando IFif (condição){ ação para condição satisfeita }[ else{ ação para condição não satisfeita } ]Ex.if (Idade < 18){Categoria = "Menor" }else{Categoria = "Maior"}Comando FORfor ( [inicialização/criação de variável de controle ;][condição ;][incremento da variável de controle] ){ ação }Ex.for (x = 0 ; x <= 10 ; x++){alert ("X igual a " + x) }ComandoWHILEExecuta uma ação enquanto determinada condição for verdadeira.while (condição){ ação }Ex.var contador = 10while (contador > 1){ contador-- }Move condicionalreceptor = ( (condição) ? verdadeiro : falso)Ex.NomeSexo = ((VarSexo == "M") ? "Masculino" : "Feminino")OBS:Nos comandos FOR e WHILE a diretiva "break" pode ser utilizada para interromper a condiçãoprincipal e sair do loop. Da mesma forma, a diretiva "continue" interrompe uma ação (sedeterminada condição ocorrer) mas volta para o loop. Diretivas/condições entre [ ] significamque são opcionais.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 38 -
    • EVENTOSSão fatos que ocorrem durante a execução do sistema, a partir dos quais o programador podedefinir ações a serem realizadas pelo programa.Abaixo apresentamos a lista dos eventos possíveis, indicando os momentos em que os mesmospodem ocorrer, bem como, os objetos passíveis de sua ocorrência.onload - Ocorre na carga do documento. Ou seja, só ocorre no BODY do documento.onunload - Ocorre na descarga (saída) do documento. Também só ocorre no BODY.onchange - Ocorre quando o objeto perde o focus e houve mudança de conteúdo. válido para os objetos Text, Select e Textarea.onblur - Ocorre quando o objeto perde o focus, independente de ter havido mudança. válido para os objetos Text, Select e Textarea.onfocus - Ocorre quando o objeto recebe o focus. válido para os objetos Text, Select e Textarea.onclick - Ocorre quando o objeto recebe um Click do Mouse. válido para os objetos Buton, Checkbox, Radio, Link, Reset e Submit.onmouseover - Ocorre quando o ponteiro do mouse passa por sobre o objeto. válido apenas para Link.onselect - Ocorre quando o objeto é selecionado. válido para os objetos Text e Textarea.onsubmit - Ocorre quando um botão tipo Submit recebe um click do mouse. válido apenas para o Form. CRIANDO VARIÁVEISA variável é criada automaticamente, pela simples associação de valores a mesma.Ex. NovaVariavel = "Jose"Foi criada a variável de nome NovaVariavel que, passou a conter a string Jose.As variáveis podem ser Locais ou Globais. As variáveis que são criadas dentro de uma funçãosão Locais e referenciáveis apenas dentro da função. As variáveis criadas fora de funções sãoGlobais, podendo serem referenciadas em qualquer parte do documento.Desta forma, variáveis que precisam ser referenciadas por várias funções ou em outra parte dodocumento, precisam ser definidas como globais.Embora não seja recomendável, em uma função, pode ser definida uma variável local com omesmo nome de uma variável global. Para isso utiliza-se o método de definição var.Ex. Variável Global : MinhaVariavel = ""Variável Local : var MinhaVariavel = "” ESCREVENDO NO DOCUMENTOO JavaScript permite que o programador escreva linhas dentro de uma página (documento),APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 39 -
    • através do método write. As linhas escritas desta forma, podem conter textos, expressõesJavaScript e comandos Html. As linhas escritas através deste método aparecerão no ponto da telaonde o comando for inserido.Ex:<script>valor = 30document.write ("Minha primeira linha")document.write ("Nesta linha aparecerá o resultado de : " + (10 * 10 + valor))</script>A idéia do exemplo acima é escrever duas linhas. Entretanto o método write não insere mudançade linha, o que provocará o aparecimento de apenas uma linha com os dois textos emendados.Para evitar este tipo de ocorrência, existe o método writeln que escreve uma linha e espaceja paraa seguinte. Entretanto, em nossos testes, este comando não surtiu efeito,obtendo-se o mesmoresultado do método write. A solução encontrada para esta situação foi a utilização do comandode mudança de parágrafo da linguagem Html.Ex:<script>valor = 30document.write ("<p>Minha primeira linha</p>")document.write ("<p>Nesta linha aparecerá o resultado de : " + (10 * 10 + valor) + "</p>")</script>Isto resolve a questão da mudança de linha, porém, vai gerar uma linha em branco, entre cadalinha, por se tratar de mudança de parágrafo. Caso não seja desejado a existência da linha embranco, a alternativa é utilizar o comando Html <br> que apenas muda de linha.Ex:<script>valor = 30document.write ("<br>Minha primeira linha")document.write ("<br>Nesta linha aparecerá o resultado de : " + (10 * 10 + valor) )</script> MENSAGENSExistem três formas de comunicação com o usuário através de mensagens.Apenas Observação.alert ( mensagem )Ex.alert ("Certifique-se de que as informações estão corretas")Mensagem que retorna confirmação de OK ou CANCELARconfirm (mensagem)Ex.if (confirm ("Algo está errado...devo continuar??")){ alert("Continuando") }APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 40 -
    • else{ alert("Parando") }Recebe mensagem via caixa de texto InputReceptor = prompt ("Minha mensagem", "Meu texto")Onde:Receptor é o campo que vai receber a informação digitada pelo usuário Minha mensagem é amensagem que vai aparecer como Label da caixa de input Meu texto é um texto, opcional, queaparecerá na linha de digitação do usuário.Ex.Entrada = prompt("Informe uma expressão matemática", "")Resultado = eval (Entrada)document.write("O resultado é = " + Resultado) CRIANDO FUNÇÕESUma função é um set de instruções, que só devem ser executadas quando a função for acionada.A sintaxe geral é a seguinte:function NomeFunção (Parâmetros){ Ação }Suponha uma função que tenha como objetivo informar se uma pessoa é maior ou menor deidade, recebendo como parâmetro a sua idade.function Idade (Anos) {if (Anos > 17){ alert ("Maior de Idade") }else{ alert ("menor de Idade") }}Para acionar esta função, suponha uma caixa de texto, em um formulário, na qual seja informadaa idade e, a cada informação, a função seja acionada.<form><input type=text size=2 maxlength=2 name="Tempo"onchange="Idade(Tempo.value)"></form>Observe-se que o parâmetro passado (quando ocorre o evento "onchange") foi o conteúdo dacaixa de texto "Tempo" (propriedade "value") e que, na função, chamamos de "Anos". Ou seja,não existe co-relação entre o nome da variável passada e a variável de recepção na função.Apenas o conteúdo é passadoAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 41 -
    • FUNÇÕES INTRÍNSECASSão funções embutidas na própria linguagem. A sintaxe geral é a seguinte:Result = função (informação a ser processada)- eval = Calcula o conteúdo da string- parseInt - Transforma string em inteiro- parseFloat - Transforma string em número com ponto flutuante- date() - Retorna a data e a hora (veja o capítulo manipulando datas)ex1: Result = eval ( " (10 * 20) + 2 - 8")ex2: Result = eval (string)No primeiro exemplo Result seria igual a 194. No segundo, depende do conteúdo da string, quetambém pode ser o conteúdo (value) de uma caixa de texto. - Funções tipicamente Matemáticas: -Math.abs(número) - retorna o valor absoluto do número (ponto flutuante)Math.ceil(número) - retorna o próximo valor inteiro maior que o númeroMath.floor(número) - retorna o próximo valor inteiro menor que o númeroMath.round(número) - retorna o valor inteiro, arredondado, do númeroMath.pow(base, expoente) - retorna o cálculo do exponencialMath.max(número1, número2) - retorna o maior número dos dois fornecidosMath.min(número1, número2) - retorna o menor número dos dois fornecidosMath.sqrt(número) - retorna a raiz quadrada do númeroMath.SQRT2 - retorna a raiz quadrada de 2 (aproximadamente 1.414)Math.SQRT_2 - retorna a raiz quadrada de 1/2 (aproximadamente 0.707)Math.sin(número) - retorna o seno de um número (anglo em radianos)Math.asin(número) - retorna o arco seno de um número (em radianos)Math.cos(número) - retorna o cosseno de um número (anglo em radianos)Math.acos(número) - retorna o arco cosseno de um número (em radianos)Math.tan(número) - retorna a tangente de um número (anglo em radianos)Math.atan(número) - retorna o arco tangente de um número (em radianos)Math.pi retorna o valor de PI (aproximadamente 3.14159)Math.log(número) - retorna o logarítmo de um númeroMath.E - retorna a base dos logarítmos naturais (aproximadamente 2.718)Math.LN2 - retorna o valor do logarítmo de 2 (aproximadamente 0.693)Math.LOG2E - retorna a base do logarítmo de 2 (aproximadamente 1.442)Math.LN10 retorna o valor do logarítmo de 10 (aproximadamente 2.302)Math.LOG10E - retorna a base do logarítmo de 10 (aproximadamente 0.434)Observação:Em todas as funções, quando apresentamos a expressão "(número)", na verdade queremos nosreferir a um argumento que será processado pela função e que poderá ser: um número, umavariável ou o conteúdo de um objeto (propriedade value).APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 42 -
    • CRIANDO NOVAS INSTÂNCIASAtravés do operador new podem ser criadas novas instâncias a objetos já existentes, mudando oseu conteúdo, porém, mantendo suas propriedades.A sintaxe geral é a seguinte:NovoObjeto = new ObjetoExistente (parâmetros)Ex1.MinhaData = new Date ()MinhaData passou a ser um objeto tipo Date, com o mesmo conteúdo existente em Date(data e hora atual)Ex2:MinhaData = new Date(1996, 05, 27)MinhaData passou a ser um objeto tipo Date, porém, com o conteúdo de uma nova data.Ex3:Suponha a existência do seguinte objeto chamado Empresasfunction Empresas (Emp, Nfunc, Prod){ this.Emp = Empthis.Nfunc = Nfuncthis.Prod = Prod }Podemos criar novas instâncias, usando a mesma estrutura, da seguinte forma:Elogica = new Empresas("Elogica", "120", "Serviços")Pitaco = new Empresas("Pitaco", "35", "Software")Corisco = new Empresas("Corisco", "42", "Conectividade")Assim, a variável Elogica.Nfunc terá o seu conteúdo igual a 120 MANIPULANDO ARRAYSO JavaScript não tem um tipo de dado ou objeto para manipular arrays. Por isso, para trabalharcom arrays é necessário a criação de um objeto com a propriedade de criação de um array. Noexemplo abaixo, criaremos um objeto tipo array de tamanho variável e com a função de "limpar"o conteúdo das variáveis cada vez que uma nova instância seja criada a partir dele.function CriaArray (n) {this.length = nfor (var i = 1 ; i <= n ; i++){ this[i] = "" } }Agora podemos criar novas instâncias do objeto "CriaArray" e alimentá-los com os dadosnecessários.NomeDia = new CriaArray(7)NomeDia[0] = "Domingo"NomeDia[1] = "Segunda"NomeDia [2] = "Terça"NomeDia[3] = "Quarta"NomeDia[4] = "Quinta"APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 43 -
    • NomeDia[5] = "Sexta"NomeDia[6] = "Sábado"Atividade = new CriaArray(5)Atividade[0] = "Analista"Atividade[1] = "Programador"Atividade[2] = "Operador"Atividade[3] = "Conferente"Atividade[4] = "Digitador"Agora poderemos obter os dados diretamente dos arrays.DiaSemana = NomeDia[4]Ocupação = Atividade[1]DiaSemana passaria a conter Quinta e Ocupação conteria Programador.Outra forma de se trabalhar com arrays é criar novas instâncias dentro do próprio objeto doarray, o que proporciona o mesmo efeito de se trabalhar com matriz. Isso pode ser feito daseguinte forma:function Empresas (Emp, Nfunc, Prod) {this.Emp = Empthis.Nfunc = Nfuncthis.Prod = Prod }TabEmp = new Empresas(3)TabEmp[1] = new Empresas("Elogica", "120", "Serviços")TabEmp[2] = new Empresas("Pitaco", "35", "Software")TabEmp[3] = new Empresas("Corisco", "42", "Conectividade")Assim, poderemos obter a atividade da empresa número 3, cuja resposta seria Conectividade, daseguinte forma:Atividade = TabEmp[3].Prod MANIPULANDO STRINGsO JavaScript é bastante poderoso no manuseio de String´s, fornecendo ao programador uma totalflexibilidade em seu manuseio.Abaixo apresentamos os métodos disponíveis para manuseio de string´s.string.length - retorna o tamanho da string (quantidade de bytes)string.charAt(posição) - retorna o caracter da posição especificada (inicia em 0)string.indexOf("string") - retorna o número da posição onde começa a primeira "string"string.lastindexOf("string") - retorna o número da posição onde começa a última "string"string.substring(index1, index2) - retorna o conteúdo da string que corresponde ao intervaloespecificado. Começando no caracter posicionado em index1 e terminando no caracterimediatamente anterior ao valor especificado em index2.Ex.Todo = "Elogica"Parte = Todo.substring(1, 4)(A variável Parte receberá a palavra log)string.toUpperCase() - Transforma o conteúdo da string para maiúsculo (Caixa Alta)string.toLowerCase() - Transforma o conteúdo da string para minúsculo (Caixa Baixa)escape ("string") - retorna o valor ASCII da string (vem precedido de %)APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 44 -
    • unscape("string") - retorna o caracter a partir de um valor ASCII (precedido de %) MANIPULANDO DATASExiste apenas uma função para que se possa obter a data e a hora. É a função Date(). Esta funçãodevolve data e hora no formato:Dia da semana, Nome do mês, Dia do mês,Hora:Minuto:Segundo e AnoEx.Fri May 24 16:58: 02 1996Para se obter os dados separadamente, existem os seguintes métodos:getDate() - Obtém o dia do mês (numérico de 1 a 31)getDay() - Obtém o dia da semana (0 a 6)getMonth() - Obtém o mês (numérico de 0 a 11)getYear() - Obtém o anogetHours() - Obtém a hora (numérico de 0 a 23)getMinutes() - Obtém os minutos (numérico de 0 a 59)getSeconds() - Obtém os segundos (numérico de 0 a 59)No exemplo abaixo obteremos o dia da semana. Para tal, utilizaremos a variável DataToda paraarmazenar data/hora e a variável DiaHoje para armazenar o número do dia da semana.DataToda = new Date()DiaHoje = DataToda.getDay()Para obter o dia da semana alfa, teremos que construir uma tabela com os dias da semana eutilizar a variável DiaHoje como indexador.function CriaTab (n) {this.length = nfor (var x = 1 ; x<= n ; x++){ this[x] = "" } }NomeDia = new CriaTab(7)NomeDia[0] = "Domingo"NomeDia[1] = "Segunda"NomeDia [2] = "Terça"NomeDia[3] = "Quarta"NomeDia[4] = "Quinta"NomeDia[5] = "Sexta"NomeDia[6] = "Sábado"DiaSemana = NomeDia[DiaHoje]Para criar uma variável tipo Date com o conteúdo informado pela aplicação, existe o métodoset. Assim, temos os seguintes métodos: setDate, setDay, setMonth, setYear, setHours,setMinutes e setSeconds.Seguindo o exemplo acima, para mudar o mês para novembro, teríamos:DataToda.setMonth(10)APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 45 -
    • Exemplos adicionais serão encontrados no capítulo "Usando Timer e Date INTERAGINDO COM O USUÁRIOA interação com o usuário se dá através de objetos para entrada de dados (textos), marcação deopções (radio, checkbox e combo), botões e links para outras páginas.Conceitualmente, os objetos são divididos em: Input, Textarea e Select. O objeto Input divide-se(propriedade Type) em:•Password •Text •Hidden •Checkbox •Radio •Button •Reset •SubmitA construção destes objetos é feita pela linguagem HTML (HiperText Mark-up Language).Portanto, é aconselhável que sejam criados utilizando-se ferramentas de geração de páginasHTML, como o HotDog ou, mais recomendado, FrontPage.Objeto Input TEXTÉ o principal objeto para entrada de dados.Suas principais propriedades são: type, size, maxlength, name e value.type=text : Especifica um campo para entrada de dados normalsize : Especifica o tamanho do campo na tela.maxlength : Especifica a quantidade máxima de caracteres permitidos.name : Especifica o nome do objetovalue : Armazena o conteúdo do campo.Os eventos associados a este objeto são: onchange, onblur, onfocus e onselect.Ex:<form name="TText"><p>Entrada de Texto <input type=text size=20 maxlength=30 name="CxTexto" value=""onchange="alert (Voce digitou + CxTexto.value)"></p></form>Objeto Input PASSWORDÉ o objeto para entrada de Senhas de acesso (password). Os dados digitados neste objeto sãocriptografados e, só são interpretados (vistos) pelo "server", por razões de segurança.Suas principais propriedades são: type, size, maxlength, name e value.type=password : Especifica um campo para entrada de senha. Os dados digitados sãosubstituidos (na tela) por "*".size : Especifica o tamanho do campo na tela.maxlength : Especifica a quantidade máxima de caracteres permitidos.name : Especifica o nome do objetovalue : Armazena o conteúdo digitado no campo.Os eventos associados a este objeto são: onchange, onblur, onfocus e onselect.Ex:<form name="TPassword"><p>Entrada de Senha<input type=password size=10 maxlength=10 name="Senha" value=""></p></form>APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 46 -
    • Objeto Input HIDDENÉ um objeto semelhante ao input text, porém, invisível para o usuário. Este objeto deve serutilizado para passar informações ao "server" (quando o formulário for submetido) sem que ousuário tome conhecimento. Suas propriedades são: name e value.name : Especifica o nome do objeto.value : Armazena o conteúdo do objetoEx:<form name="THidden"><input type=hidden size=20 maxlength=30 name="HdTexto" value="" ></form></p>Objeto Input CHECKBOXSão objetos que permitem ao usuário ligar ou desligar uma determinada opção.Suas principais propriedades são: name, value e checked.name : Especifica o nome do objetovalue : Especifica o valor que será enviado ao "server" se o objeto estiver ligado (checked).Caso seja omitido, será enviado o valor default "on" .Esta propriedade também serve para ativar comandos lógicos, testando-se a condição de"checked".checked : Especifica que o objeto inicialmente estará ligadoO único evento associado a este objeto é onclick.Ex:No exemplo abaixo, criaremos um objeto input.text e três objetos checkbox. O primeirocheckbox, quando ativado, transformará o texto em caracteres minúsculos. O segundo checkbox,quando ativado, transformará o texto em caracteres maiúsculos. O terceiro checkbox, quandoativado, dará um aviso do conteúdo que será recebido pelo "server" caso o formulário sejasubmetido para este.<SCRIPT>function AltMaiusc () {document.TCheck.Muda.value = document.TCheck.Muda.value.toUpperCase()document.TCheck.Opt1.checked = false}function AltMinusc () {document.TCheck.Muda.value = document.TCheck.Muda.value.toLowerCase()document.TCheck.Opt2.checked = false}</SCRIPT><p><form name="TCheck">Muda Case <input type=text size=20 maxlength=20 name="Muda"> </p><p>Minusculo<input type=checkbox name="Opt1" value="1" checkedonclick="if (this.checked){ AltMinusc() } ">Maiusculo<input type=checkbox name="Opt2" value="2"APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 47 -
    • onclick="if (this.checked){ AltMaiusc() } ">Demo valor<input type=checkbox name="Opt3"onclick="if (Opt3.checked){alert (Server recebera = + Opt3.value) } "></p></form>Existe ainda uma outra forma de manipular este objeto, em forma de array, que é a seguinte:form.elements[index].propriedade. Esta não é uma boa forma porque o index é único dentro deum formulário, exigindo muito cuidado quando se acrescenta ou se deleta um objeto, pois, nestecaso, haverá um natural deslocamento do index, podendo comprometer a lógica.Objeto Input RADIOSão objetos que permitem ao usuário a escolha de apenas uma alternativa, diante de uma série deopções.Suas principais propriedades são: name, value e checked.name : Especifica o nome do objeto. Para caracterizar uma mesma série de opções, todos osobjetos desta série têm que ter o mesmo "name".value : Especifica o valor que será enviado ao "server" se o objeto estiver ligado (checked). Casoseja omitido, será enviado o valor default "on" . Esta propriedade também serve para ativarcomandos lógicos, testando-se a condição de "checked".checked : Especifica que o objeto inicialmente estará ligado. Para utilização deste objeto éimportante o conhecimento de outras propriedades associadas:Objeto.length : Retorna a quantidade de opções existentes na listaObjeto.[index].value : retorna o texto (value) associado a cada opçãoObjeto.[index].checked : retorna verdadeiro ou falso.O único evento associado a este objeto é onclick.Ex. No exemplo abaixo temos dois sets de objetos radio. O primeiro tem o objetivo de mudar acor de fundo do documento atual. O segundo tem o objetivo levar informações ao "server".<p>Radio</p><p> <input type=radio name="Rad" value="1"onclick="document.bgColor=green"> Fundo Verde<input type=radio name="Rad" value="2"onclick="document.bgColor=blueviolet"> Fundo Violeta<input type=radio name="Rad" value="3"onclick="document.bgColor=#FFFF00"> Fundo Amarelo</p>Objeto Input BUTTONAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 48 -
    • Este objeto tem por finalidade criar um botão ao qual se possa atrelar operações lógicas, a seremexecutadas quando o mesmo receber um click.Suas propriedades são: name e value.name : Especifica o nome do objeto.value : Especifica o nome que aparecerá sobre o botão O único evento associado a este objeto éonclick.Ex.<p><form method="POST" name="TstButton">Digite um Texto <input type=text size=30 maxlength=30 name="Teste" value=""></p><p>Click no Botao <input type=button name="Bteste" value="Botao de teste"onclick="alert (Voce digitou: + TstButton.Teste.value)"></p></form>Objeto Input RESETEste objeto é um botão que tem por finalidade, única, limpar os campos digitados pelo usuário,restaurando o conteúdo do formulário para os valores iniciais.É recomendável a utilização deste objeto, para facilitar o usuário a limpar suas informações, umavez que a utilização da opção "reload" do "browser" (que seria uma forma) não perde asnfromações digitadas.Suas propriedades são: name e value.name : Especifica o nome do objeto.value : Especifica o nome que aparecerá sobre o botãoO único evento associado a este objeto é onclick.Ex.<p><form method="POST" name="TesteRes">Digite um Texto<input type=text size=10 maxlength=20 name="Teste" value="">Apague o Texto <input type=reset name="Bres" value="Reset"></form></p>Objeto Input SUBMITEste objeto é um botão que tem por finalidade submeter (enviar) o conteúdo dos objetos doformulário ao "server". O formulário será submetido à URL especificada na propriedade "action"do formulário.Suas propriedades são: name e value.name : Especifica o nome do objeto.value : Especifica o nome que aparecerá sobre o botãoO único evento associado a este objeto é onclick. Embora se possa atrelar lógica a este evento,não se pode evitar que o formulário seja submetido, portanto, não é aconselhavel o seu uso. Maisseguro e mais útil é a utilização da propriedade onSubmit do formulário. Este permite que seatrele lógica e decida-se pela submissão ou não.Ex.<script>function TestaVal() {APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 49 -
    • if (document.TesteSub.Teste.value == "") {alert ("Campo nao Preenchido...Form nao Submetido")return false }else {alert ("Tudo Ok....Form Submetido")return true } }</script><p><form method="POST" name="TesteSub"onSubmit="return TestaVal()"action="http://10.0.5.2/scripts/isapielo.dll/vbloja.loja.action">Digite um Texto <input type=text size=10 maxlength=10 name="Teste" value="">Botao Submit <input type=submit name="Bsub" value="Manda p/Server"></p></form>No exemplo acima, o formulário está sendo submetido a URL "10.0.5.2" (que é o endereço IPde um "Server"). Este servidor está rodando o "Microsoft Internet Information Server". Estamosenviando os dados a um "OLE", que está no subdiretório "scripts", chamado "isapielo.dll", quetem por objetivo fazer a conecção com aplicações escritas em VB. A aplicação VB que está endochamada, é um OLE de nome "vbloja" no qual estamos acionando a classe "loja" e o método"action".A aplicação VB, deste exemplo, fará apenas a devolução dos dados recebidos pelo Server.Objeto TEXTAREAÉ um objeto para entrada de dados em um campo de múltiplas linhas. Suas principaispropriedades são: name, rows e cols.name : Especifica o nome do objetorows : Especifica a quantidade de linhas que aparecerão na telacols : Especifica a quantidade de caracteres que aparecerão em cada linhavalue : Acessa o conteúdo do campo via programação.Os eventos associados a este objeto são: onchange, onblur, onfocus e onselect.Ex:<form name="TesteTextarea"><p>Texto de Múltiplas Linhas <textarea name="MultText" rows=2 cols=40>Primeira linha do texto inicialsegunda linha do texto inicial</textarea></p>Objeto SELECTÉ um objeto para entrada de opções, onde o usuário, a partir de uma lista de alternativas,seleciona uma ou mais opções.Suas principais propriedades são: name, size, value e multiple.name : Especifica o nome do objetosize : Especifica a quantidade de opções que aparecerão na tela simultaneamentevalue : Associa um valor ou string para cada opção (opcional)APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 50 -
    • multiple : Especifica a condição de múltipla escolha (usando-se a tecla Ctrl)Para utilização deste objeto é importante o conhecimento de outras propriedades associadas:Objeto.length : Retorna a quantidade de opções existentes na listaObjeto.selectedindex : Retorna o "index" do objeto selecionado (primeiro = 0)Objeto.options[index].text : retorna o texto externo associado a cada opçãoObjeto.options[index].value : retorna o texto interno (value) associado a cada opçãoObjeto.options[index].selected : retorna verdadeiro ou falsoOs eventos associados a este objeto são: onchange, onblur e onfocus.Ex1:Neste exemplo é importante observar os seguintes aspectos:a) A lista permite apenas uma seleçãob) A quarta opção aparecerá inicialmente selecionada (propriedade "selected")c) Não utilizamos a propriedade "value". Assim, a propriedade "text" e a propriedade "value"passam a ter o mesmo valor, ou seja, o valor externo que aparece na tela.<script>function Verselect(Campo) {Icombo = Campo.selectedIndexalert ("Voce escolheu " + Campo.options[Icombo].text) }</script><p>Objeto Select <select name="Combo1" size=1 onchange="Verselect(Combo1)"><option>Opcao 1<option>Opcao 2<option>Opcao 3<option selected>Opcao 4 (recomendada)<option>Opcao 5<option>Opcao 6</select></p>Ex2:Neste exemplo é importante observar os seguintes aspectos:a) A lista permite múltiplas seleçõesb) Utilizamos a propriedade "value". Assim as propriedades "text" e "value"têm valores diferentes: text retornará Escolha 1 a Escolha 4 e valueretornará List1 a List4.c) O parâmetro passado, quando da ocorrência do evento onblur, foi this.Esta diretiva significa que estamos passando este objeto.<script>function Vermult(Lista) {var opcoes = ""for (i = 0 ; i < Lista.length ; i++) {if (Lista.options[i].selected) {opcoes += (Lista.options[i].value + ", ") }}APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 51 -
    • alert ("As opcoes escolhidas foram : " + opcoes) }</script><p>Objeto Select2 <select name="Combo2" size=4 multiple onblur="Vermult(this)"><option value="List1">Escolha 1 </option><option value="List2">Escolha 2 </option><option value="List3">Escolha 3 </option><option value="List4">Escolha 4 </option></select></p>Focando um ObjetoEste método permite que o cursor seja ativado em um determinado objeto (focado). Isso pode serfeito na carga do documento, a partir da ocorrência de um evento ou mesmo dentro de umafunção.Observe que até agora o usuário tinha que dar um "Click" para focar o objeto desejado.De forma semelhante existe o método "Select". Este método marca o conteúdo do objeto comuma tarja roxa, permitindo ao usuário, em caso de substituição do conteúdo do campo, não terque deletar o conteúdo anterior, pois, com este método, a deleção se dá de forma automáticaquando da digitação do novo conteúdo.Os métodos "Focus" e "Select" podem ser utilizados nos seguintes objetos:password, select, text e textareaNo exemplo abaixo, utilizaremos o evento onload para setar o focus para o primeiro objeto doformulário e os métodos focus e select para, na rotina de crítica dos dados, focar o objeto quecontiver erro de preenchimento.Ex.<body onload="document.TstFocus.Nome.focus()"><script>DdosOk = truefunction Criticar() {DadosOk = falseDataAtual = new Date()MesAtual = DataAtual.getMonth() + 1AnoAtual = DataAtual.getYear() + 1900Nome = document.TstFocus.Nome.valueMes = parseInt(document.TstFocus.Mes.value)Ano = parseInt (document.TstFocus.Ano.value)//if (Ano < 1900){Ano = Ano + 1900 }if (Nome == ""){ alert ("Informe o seu Nome, Não deixe em branco")document.TstFocus.Nome.focus()return }if (Mes < 1 || Mes > 12){ alert ("O Mês informado não é válido, informe corretamente") document.TstFocus.Mes.focus()document.TstFocus.Mes.select()APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 52 -
    • return }if (Ano == AnoAtual && Mes > MesAtual){ alert ("O período informado é superior a data atual")document.TstFocus.Mes.focus()document.TstFocus.Mes.select()return }if (Ano < 1996 || Ano > AnoAtual){ alert ("O Ano informado não é válido, informe corretamente") document.TstFocus.Ano.focus()document.TstFocus.Ano.select()return }DadosOk = true}</script><form name="TstFocus" method="POST"><p>Informe o seu Nome <input type=text size=30 maxlength=30 name="Nome"></p><p> Informe o mês desejado <input type=text size=2 maxlength=2 name="Mes"></p><p> Informe o ano desejado <input type=text size=4 maxlength=4 name="Ano" ></p><p> <input type=button name="Testa" value="Testar Validade"onclick="Criticar()if (DadosOk){alert (Todos os Dados estão Corretos) } "></p></form> USANDO TIMER e DATEÉ um método que permite a programação para que uma determinada ação só ocorra após otranscurso de um determinado tempo.Variável = setTimeout ("ação", tempo)Onde:Variável é uma variável apenas para controle do timeração é a ação que se quer realizar.tempo é o tempo de espera para que a ação ocorra, em milisegundos.Obs:É importante observar que a ação só ocorrerá uma vez. Para que a ação volte a ocorrer, seránecessário repetir o comando dentro da ação, obtendo-se, assim, um LOOP.Para interromper um LOOP, provocado pela forma acima, deve-se utilizar o seguinte método:clearTimeout (Variável)Onde:Variável é o nome da variável de controle do timer.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 53 -
    • Abaixo encontra-se um exemplo de um formulário que apresenta a data e hora atual, atualizandoos dados a cada um segundo, tendo dois botões de rádio que tem a função de ativar e desativar aatualização dos dados. Apresenta também, fora do formulário, a data contendo dia e mês porextenso.<script>function Hoje() {ContrRelogio = setTimeout ("Hoje()", 1000)Hr = new Date()dd = Hr.getDate()mm = Hr.getMonth() + 1aa = Hr.getYear()hh = Hr.getHours()min = Hr.getMinutes()seg = Hr.getSeconds()DataAtual = ((dd < 10) ? "0" + dd + "/" : dd + "/")DataAtual += ((mm < 10) ? "0" + mm + "/" + aa : mm + "/" + aa)HoraAtual = ((hh < 10) ? "0" + hh + ":" : hh + ":")HoraAtual += ((min < 10) ? "0" + min + ":" : min + ":")HoraAtual += ((seg < 10) ? "0" + seg : seg)document.DataHora.Data.value=DataAtualdocument.DataHora.Hora.value=HoraAtual}//function CriaArray (n) {this.length = n }//NomeDia = new CriaArray(7)NomeDia[0] = "Domingo"NomeDia[1] = "Segunda"NomeDia[2] = "Terça"NomeDia[3] = "Quarta"NomeDia[4] = "Quinta"NomeDia[5] = "Sexta"NomeDia[6] = "Sábado"//NomeMes = new CriaArray(12)NomeMes[0] = "Janeiro"NomeMes[1] = "Fevereiro"NomeMes[2] = "Março"NomeMes[3] = "Abril"NomeMes[4] = "Maio"NomeMes[5] = "Junho"NomeMes[6] = "Julho"NomeMes[7] = "Agosto"NomeMes[8] = "Setembro"NomeMes[9] = "Outubro"APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 54 -
    • NomeMes[10] = "Novembro"NomeMes[11] = "Dezembro"//Data1 = new Date()dia = Data1.getDate()dias = Data1.getDay()mes = Data1.getMonth()ano = Data1.getYear()document.write ("Recife, " + NomeDia[dias] + " " + dia + " de " +NomeMes[mes] + " de " + (ano + 1900 ) )</script><form name="DataHora">Data : <input type=text size=10 maxlength=10 name="Data">Hora : <input type=text size=10 maxlength=10 name="Hora"><input type=radio name="Botao" value="Para Relogio" checkedonclick="clearTimeout(ContrRelogio)">Desativa<input type=radio name="Botao" value="Ativa Relogio"onclick="ContrRelogio = setTimeout(Hoje(), 1000)">Ativa ABRINDO NOVAS JANELASNeste capítulo mostraremos como podem ser abertas novas janelas sobre uma janela contendo odocumento principal.É importante não confundir esta forma de abrir janelas com a divisão da tela em várias partes, oumesmo com a chamada de outras páginas. Para que não existam dúvidas, explicaremos um poucosobre estes dois outros métodos.A divisão de uma tela em várias janelas contendo documentos diferentes é feita através do objetoFRAME do Html. Neste caso, a tela inteira é considerada como um FrameSet e cada parte emque ela for dividida é considerada como um Frame. Cada Frame é definido dentro do FrameSetatravés da especificação dos parâmetros: % da tela na vertical (cols), % da tela na horizontal(rows) e nome de cada frame. Uma vez criado o FrameSet poderemos abrir documentos distintosem cada Frame. Para fazer isto, acrescente ao link do documento a diretiva target=nome doframe.Ex.<href="Eventos.htm" target="Principal">Isto fará com que o arquivo html Eventos.htm seja aberto dentro do frame de nome PrincipalA simples chamade de outras telas (documentos) é feita através do link para o documentodesejado.Ex.<href="Eventos.htm" >Isto fará com que o arquivo html Eventos.htm seja aberto em substituição a tela existente.Bem, voltemos ao nosso caso que é a abertura de janelas sobre um documento. Isto é feitoatravés de comandos JavaScript, que permitem: Abrir uma janela, Abrir um documento dentrodesta janela, Escrever o conteúdo da janela, Fechar a janela e Fechar o documento.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 55 -
    • Abrindo a JanelaA sintaxe geral deste método é a seguinte:Variavel = window.open ("Url", "Nome da janela", "Opções")Onde:Variavel - Nome que será atribuido como propriedade da janela.Url - Endereço Internet onde a janela será aberta. Normalmente voce estará utilizando a suaprópria Url, neste caso, preencha com "".Nome da Janela - É o nome que aparecerá no top da janela (Título)Opções - São as opções que definem as características da janela, quais sejam:•toolbar - Cria uma barra de ferramentas tipo "Back", "Forward", etc.•location - Abre a barra de location do browse•directories - Abre a barra de ferramentas tipo "Whats New", "Handbook", etc.•status - Abre uma barra de status no rodapé da janela•scrollbars - Abre barras de rolamento vertical e horizontal•menubar - Cria uma barra de menu tipo "File", "Edit", etc.•resizable - Permite ao usuário redimencionar a janela•width - Especifica a largura da janela, em pixels•height - Especifica a altura da janela, em pixelsTodas as opções (exceto width e height) são boleanas e podem ser setadas de duas formas.Exemplo: "toolbar" ou "toolbar=1") são a mesma coisa. Se nada for especificado, entende-se quetodas as opções estão ligadas; Caso seja especificada qualquer opção, será entendido que estãoligadas apenas as opções informadas.As opções devem ser informadas separadas por vírgula, sem espaço entre elas.Abrindo um DocumentoPara abrir um documento dentro da janela, deve ser utilizado o seguinte método:Variavel.document.open()Onde "Variavel" é o nome da variável associada ao método window.openEscrevendo no DocumentoPara escrever a tela no documento, deve ser utilizado o seguinte método:Variavel.document.write ("Comandos html, Comandos JavaScript, Textos, etc.")Fechando a JanelaPara fechar a janela, utilize o seguinte método:Variavel.document.write ("window.close()")Fechando o DocumentoPara fechar o documento, utilize o seguinte método:Variavel.document.close ()A seguir, apresentamos um exemplo no qual estamos abrindo um documento onde o usuárioescolherá uma opção (Elógica ou Recife) e dará um Click em um botão (Nova Janela). Nestemomento será aberta uma nova janela que conterá a foto escolhida pelo usuário e um botão que,ao receber o Click, fechará a janela.Normalmente, qualquer href ou src dentro de uma página, por padrão, acessa o arquivo ou aimagem no mesmo diretório onde está a página atual, a menos que seja especificado um novocaminho (Path).APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 56 -
    • No caso de abertura de uma nova janela, através do método window.open, as versões maisantigas dos browses não conseguem "ver" o Path, sendo necessária a completa informação docaminho (path) onde o arquivo ou imagem estão armazenados, em todas as chamadas doscomandos Html href ou src.Observe que na função estamos utilizando dois novos métodos:navigator.appVersion para verificarmos a versão do browse que esta sendo utilizadodocument.location. para obtermos o Path da localização do arquivo Html que está correntementeem uso.No exemplo abaixo estamos, inicialmente, identificando a versão do browse.Caso seja antiga,para não escrevermos todo o caminho a cada chamada e ainda, considerando que os arquivoschamados estão no mesmo diretório da página atual, estamos obtendo o Path do arquivo atual eeliminando o nome do arquivo que está na última referencia do Path. Quando fizermos achamada das imagens (comando src) só será necessário a concatenação do nome do arquivochamado com a raiz do path que, no exemplo, armazenamos na variável de nome Local.<script>function Abrejanela(Opcao) {Versao = navigator.appVersionVersao = Versao.substring(0, 1)Local = ""if (Versao < 3) {Local = document.locationUltLoc = Local.lastIndexOf("/")Local = Local.substring(0, UltLoc + 1)}NovaJanela = window.open ("", "OutraJanela", "width=300,height=400")NovaJanela.document.open()NovaJanela.document.write ("<html><head><title>Nova Janela")NovaJanela.document.write ("</title></head><body bgcolor=white>")NovaJanela.document.write ("<form>")if (Opcao == 1){ NovaJanela.document.write ("<br>Logomarca teste1<hr><br>")NovaJanela.document.write("<img width=200 height=200 src=" + Local + "edson.gif>") }else{ NovaJanela.document.write ("<br>Logomarca teste2<hr><br>")NovaJanela.document.write("<img width=150 height=200 src=" + Local + "Recife.gif>") }NovaJanela.document.write ("<br><hr><p></p></form>")NovaJanela.document.write ("<form><input type=button name=Fecha" +"value=Fecha Janela" + "onclick=window.close()>")NovaJanela.document.write ("</form></body></html>")APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 57 -
    • NovaJanela.document.close() }</script><body><p></p><p>Escolha a foto a ser apresentada na nova janela:</p><form method="POST" name="Form1"><p><input type=radio name="Opcao" value="1" checked>Elogica<input type=radio name="Opcao" value="2">Recife</p> <p><input type="button" name="Envia" value="Nova Janela"onclick="if (Form1.Opcao[0].checked == true){Abrejanela(Form1.Opcao[0].value) }else{Abrejanela(Form1.Opcao[1].value) } "></p></form>APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 58 -
    • Introdução à Linguagem PHP Índice01. Introdução Client-Side Scripts Server-Side Scripts O que é PHP? O que pode ser feito com PHP? Como surgiu a linguagem PHP?02. Enviando Dados para o Servidor HTTP O método GET Headers O método POST Utilizando GET e POST03. Sintaxe Básica Delimitando o código PHP Separador de instruções Nomes de variáveis Comentários Comentários de uma linha: Comentários de mais de uma linha: Imprimindo código html04. Tipos Tipos Suportados Inteiros (integer ou long)APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 59 -
    • Números em Ponto Flutuante (double ou float) Strings Arrays Objetos Booleanos Transformação de tipos Coerções Transformação explícita de tipos Com a função settype05. Operadores Aritméticos de strings de atribuição bit a bit Lógicos Comparação Expressão condicional de incremento e decremento06. Estruturas de Controle Blocos Comandos de seleção if switch comandos de repetição while do... while forAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 60 -
    • Quebra de fluxo Break Continue07. Funções Definindo funções Valor de retorno Argumentos Passagem de parâmetros por referência Argumentos com valores pré-definidos (default) Contexto Escopo08. Variáveis e Constantes Declaração de uma variável O modificador static Variáveis Variáveis Variáveis enviadas pelo navegador URLencode Utilizando arrays Variáveis de ambiente Verificando o tipo de uma variável Função que retorna o tipo da variável Funções que testam o tipo da variável Destruindo uma variável Verificando se uma variável possui um valor A função isset A função emptyAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 61 -
    • Constantes pré-definidas Definindo constantes09. Classes e Objetos Classe Objeto A variável $this SubClasses Construtores10. Noções de SQL Introdução Estrutura das tabelas Comando Create Comando Drop Comando Alter Manipulando dados das tabelas Comando SELECT Comando INSERT Comando UPDATE Comando DELETE11. Acessando o mySQL via PHP Estabelecendo conexões Selecionando a base de dados Realizando consultas Apagando o resultado Número de linhasAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 62 -
    • Utilizando os resultados Alterando o ponteiro de um resultado12. Acessando o PostgreSQL via PHP Estabelecendo conexões Realizando consulta Verificando o erro na execução de uma query Apagando o resultado Número de linhas Utilizando os resultados13. Utilizando headers14. Utilizando cookies O que são Gravando cookies Lendo cookies gravados15. Manipulando arquivos Copiando Arquivos Verificando o tamanho de um arquivo Verificando se um arquivo existe Limpando o cachê Abrindo arquivos para leitura e/ou escrita Lendo de um arquivo Escrevendo em um arquivo Exemplo Uploads com formulários HTML16. Enviando e-mailAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 63 -
    • 01. IntroduçãoClient-Side ScriptsSão responsáveis pelas ações executadas no browser, sem contato com o servidor. Os exemplosmais comuns de aplicações client-side são imagens e textos que mudam com o passar do mouse.Os scripts client-side são muito úteis para fazer validações de formulários sem utilizarprocessamento do servidor e sem provocar tráfego na rede. Outra utilização comum é naconstrução de interfaces dinâmicas e "leves".Server-Side ScriptsOs scripts server-side são responsáveis pela criação de páginas em tempo real. Num mecanismode busca, por exemplo, seria inviável manter um arquivo para cada consulta a ser realizada. Oque existe é um modelo da página de resposta, que é mesclado com os dados no momento emque a página é requisitada.O que é PHP?PHP é uma linguagem que permite criar sites WEB dinâmicos, possibilitando uma interação como usuário através de formulários, parâmetros da URL e links. A diferença de PHP com relação alinguagens semelhantes a Javascript é que o código PHP é executado no servidor, sendo enviadopara o cliente apenas html puro. Desta maneira é possível interagir com bancos de dados eaplicações existentes no servidor, com a vantagem de não expor o código fonte para o cliente.Isso pode ser útil quando o programa está lidando com senhas ou qualquer tipo de informaçãoconfidencial.O que diferencia PHP de um script CGI escrito em C ou Perl é que o código PHP fica embutidono próprio HTML, enquanto no outro caso é necessário que o script CGI gere todo o códigoHTML, ou leia de um outro arquivo.O que pode ser feito com PHP?Basicamente, qualquer coisa que pode ser feita por algum programa CGI pode ser feita tambémcom PHP, como coletar dados de um formulário, gerar páginas dinamicamente ou enviar ereceber cookies.PHP também tem como uma das características mais importantes o suporte a um grande númerode bancos de dados, como dBase, Interbase, mSQL, mySQL, Oracle, Sybase, PostgreSQL evários outros. Construir uma página baseada em um banco de dados torna-se uma tarefaextremamente simples com PHP.Além disso, PHP tem suporte a outros serviços através de protocolos como IMAP, SNMP,NNTP, POP3 e, logicamente, HTTP. Ainda é possível abrir sockets e interagir com outrosprotocolos.Como surgiu a linguagem PHP?A linguagem PHP foi concebida durante o outono de 1994 por Rasmus Lerdorf. As primeirasversões não foram disponibilizadas, tendo sido utilizadas em sua home-page apenas para que elepudesse ter informações sobre as visitas que estavam sendo feitas. A primeira versão utilizadapor outras pessoas foi disponibilizada em 1995, e ficou conhecida como "Personal Home PageAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 64 -
    • Tools" (ferramentas para página pessoal). Era composta por um sistema bastante simples queinterpretava algumas macros e alguns utilitários que rodavam "por trás" das home-pages: umlivro de visitas, um contador e algumas outras coisas.Em meados de 1995 o interpretador foi reescrito, e ganhou o nome de PHP/FI, o "FI" veio deum outro pacote escrito por Rasmus que interpretava dados de formulários HTML (FormInterpreter). Ele combinou os scripts do pacote Personal Home Page Tools com o FI e adicionousuporte a mSQL, nascendo assim o PHP/FI, que cresceu bastante, e as pessoas passaram acontribuir com o projeto.Estima-se que em 1996 PHP/FI estava sendo usado por cerca de 15.000 sites pelo mundo, e emmeados de 1997 esse número subiu para mais de 50.000. Nessa época houve uma mudança nodesenvolvimento do PHP. Ele deixou de ser um projeto de Rasmus com contribuições de outraspessoas para ter uma equipe de desenvolvimento mais organizada. O interpretador foi reescritopor Zeev Suraski e Andi Gutmans, e esse novo interpretador foi a base para a versão 3.O lançamento do PHP4, ocorrido em 22/05/2000, trouxe muitas novidades aos programadores dePHP. Uma das principais foi o suporte a sessões, bastante útil pra identificar o cliente quesolicitou determinada informação. Além das mudanças referentes a sintaxe e novos recursos deprogramação, o PHP4 trouxe como novidade um otimizador chamado Zend, que permite aexecução muito mais rápida de scripts PHP. A empresa que produz o Zend promete para este anoo lançamento de um compilador de PHP. Códigos compilados serão executados maisrapidamente, além de proteger o fonte da aplicação. 02. Enviando Dados para o Servidor httpProgramar para a web pode ser considerado como um jogo que consiste em receber os dados dousuário, processá-los e enviar a resposta dinâmica. Uma vez enviada a resposta, é encerrado ocontato entre o servidor e o cliente. Portanto a primeira coisa a aprender é como fazer parareceber os dados enviados pelo browser para o servidor.O protocolo HTTP provê dois principais métodos para enviar informações para o servidor web,além da URL referente ao arquivo solicitado. Esses métodos são o POST e o GET.O protocolo HTTP/1.0 também especifica o método HEAD, utilizado apenas para transmitirinformações do header, além dos métodos PUT e DELETE, que não serão abordados nestecurso.O método GETA especificação do protocolo HTTP/0.9 (a primeira implementação do HTTP) possuía adefinição do método GET, utilizado pelo browser para solicitar um documento específico.Por exemplo: a seguinte requisição HTTP retornaria o documento "index.html", localizado nodiretório do servidro chamado "teste":GET /teste/index.html CRLFAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 65 -
    • Devemos notar que a requisição GET inicia com a palavra GET, inclui o documento solicitado eencerra com a combinação dos caracteres carriage return e line feed.Para um melhor entendimento, você pode fazer uma requisição GET conectando diretamente emalgum servidor WEB, conectando através de um programa de telnet (geralmente o servidor httputiliza a porta 80). A resposta será o código da página solicitada.telnet www.guia-aju.com.br 80Trying 200.241.59.16...Connected to www.guia-aju.com.br.Escape character is ^].GET /index.php3(... página solicitada ...)Connection closed by foreign host.Obviamente a diferença do browser é que ele trata as informações recebidas e exibe a página jáformatada.Através do método GET também é possível passar parâmetros da requisição ao servidor, quepode tratar esses valores e até alterar a resposta a depender deles, como no exemplo abaixo:telnet www.guia-aju.com.br 80Trying 200.241.59.16...Connected to www.guia-aju.com.br.Escape character is ^].GET /index.php3?id=0024horas&tipo=Taxi(... página solicitada ...)Connection closed by foreign host.No exemplo são passados dois parâmetros: id e tipo. Esses parâmetros estão no formatoconhecido por URLencode, que é detalhado no capítulo 09.Apesar de ser possível passar parâmetros utilizando o método GET, e com isso gerar páginasdinamicamente, este método tem pelo menos dois problemas que em determinadas circunstânciaspodem ser considerados sérios:O primeiro é que o GET permite uma quantidade de dados passados limitada a 1024 caracteres, oque pode gerar perda de informações em certos casos.O segundo é que pelo fato de que as informações fazem parte da URL, todos os dados podem servistos pelo usuário. Isso pode ser extremamente perigoso quando informações sigilosas estãoenvolvidas (senha, por exemplo).HeadersA versão 1.0 do protocolo HTTP trouxe boas inovações ao mesmo. Uma delas foi a criação deheaders nas mensagens de requisição e de resposta. Os headers são informações trocadas entre onavegador e o servidor de maneira transparente ao usuário, e podem conter dados sobre o tipo e aversão do navegador, a página de onde partiu a requisição (link), os tipos de arquivos aceitoscomo resposta, e uma série de outras informações.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 66 -
    • Assim foi possível definir um outro método de requisição de arquivos, que resolveu os principaisproblemas do método GET.O método POSTAtravés da utilização de headers é possível enviar os parâmetros da URL solicitada sem exporesses dados ao usuário, e também sem haver um limite de tamanho.Uma conexão ao servidor HTTP utilizando o método POST seria algo semelhante ao que segue:telnet www.guia-aju.com.br 80Trying 200.241.59.16...Connected to www.guia-aju.com.br.Escape character is ^].POST /index.php3Accept */*Content-type: application/x-www-form-urlencodedContent-length:22id=0024horas&tipo=Taxi(... página solicitada ...)Connection closed by foreign host.Devemos observar os headers enviados ao servidor: a linha "Accept" informa os tipos de dadosque podem ser enviados como resposta (no caso, todos). A linha "Content-type" informa o tipode dado que está sendo enviado (urlencoded). O terceiro header é o mais importante pois informao tamanho do corpo da mensagem, que contém os parâmetros. Após todos os headers há um saltode linha e então é iniciado o corpo da mensagem, no formato urlencoded.Obviamente o usuário não deve se preocupar com os headers, em codificar os dados ou emcalcular o tamanho do corpo da mensagem. O browser faz isso de maneira transparente.Utilizando GET e POSTO método GET pode ser utilizado através da digitação de um endereço no local apropriado donavegador ou através de um hiperlink, ou seja, uma referência de uma página a outra. Nessescasos é preciso converter os dados para o formato urlencode. A terceira maneira de utilizar oGET é através de formulários HTML, e neste caso o usuário não precisa se preocupar com acodificação dos dados. A utilização de formulários HTML é a única maneira possível desubmeter dados pelo método POST. 03. Sintaxe BásicaDelimitando o código PHPO código PHP fica embutido no próprio HTML. O interpretador identifica quando um código éPHP pelas seguintes tags:<?phpcomandos?><script language="php">comandos</script><?APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 67 -
    • comandos?><%comandos%>O tipo de tags mais utilizado é o terceiro, que consiste em uma "abreviação" do primeiro. Parautilizá-lo, é necessário habilitar a opção short-tags na configuração do PHP. O último tipo servepara facilitar o uso por programadores acostumados à sintaxe de ASP. Para utilizá-lo também énecessário habilitá-lo no PHP, através do arquivo de configuração php.ini.Separador de instruçõesEntre cada instrução em PHP é preciso utilizar o ponto-e-vírgula, assim como em C, Perl e outraslinguagens mais conhecidas. Na última instrução do bloco de script não é necessário o uso doponto-e-vírgula, mas por questões estéticas recomenda-se o uso sempre.Nomes de variáveisToda variável em PHP tem seu nome composto pelo caracter $ e uma string, que deve iniciar poruma letra ou o caracter "_". PHP é case sensitive, ou seja, as variáveis $vivas e $VIVAS sãodiferentes. Por isso é preciso ter muito cuidado ao definir os nomes das variáveis. É bom evitaros nomes em maiúsculas, pois como veremos mais adiante, o PHP já possui alguma variáveispré-definidas cujos nomes são formados por letras maiúsculas.ComentáriosHá dois tipos de comentários em código PHP:Comentários de uma linha:Marca como comentário até o final da linha ou até o final do bloco de código PHP o que vierantes. Pode ser delimitado pelo caracter "#" ou por duas barras ( // ).Exemplo:<? echo "teste"; #isto é um teste ?><? echo "teste"; //este teste é similar ao anterior ?>Comentários de mais de uma linha:Tem como delimitadores os caracteres "/*" para o início do bloco e "*/" para o final docomentário. Se o delimitador de final de código PHP ( ?> ) estiver dentro de um comentário, nãoserá reconhecido pelo interpretador.Exemplos:<?echo "teste"; /* Isto é um comentário com maisde uma linha, mas não funciona corretamente ?>*/<?echo "teste"; /* Isto é um comentário com maisde uma linha que funciona corretamenteAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 68 -
    • */?>Imprimindo código htmlUm script php geralmente tem como resultado uma página html, ou algum outro texto. Para geraresse resultado, deve ser utilizada uma das funções de impressão, echo e print. Para utilizá-lasdeve-se utilizar um dos seguintes formatos:print(argumento);echo (argumento1, argumento2, ... );echo argumento; 04. TiposTipos SuportadosPHP suporta os seguintes tipos de dados:  Inteiro  Ponto flutuante  String  Array  ObjetoPHP utiliza checagem de tipos dinâmica, ou seja, uma variável pode conter valores de diferentestipos em diferentes momentos da execução do script. Por este motivo não é necessário declarar otipo de uma variável para usá-la. O interpretador PHP decidirá qual o tipo daquela variável,verificando o conteúdo em tempo de execução.Ainda assim, é permitido converter os valores de um tipo para outro desejado, utilizando otypecasting ou a função settype (ver adiante).Inteiros (integer ou long)Uma variável pode conter um valor inteiro com atribuições que sigam as seguintes sintaxes:$vivas = 1234; # inteiro positivo na base decimal$vivas = -234; # inteiro negativo na base decimal$vivas = 0234; # inteiro na base octal-simbolizado pelo 0 # equivale a 156 decimal$vivas = 0x34; # inteiro na base hexadecimal(simbolizado # pelo 0x) equivale a 52 decimal.A diferença entre inteiros simples e long está no número de bytes utilizados para armazenar avariável. Como a escolha é feita pelo interpretador PHP de maneira transparente para o usuário,podemos afirmar que os tipos são iguais.Números em Ponto Flutuante (double ou float)Uma variável pode ter um valor em ponto flutuante com atribuições que sigam as seguintessintaxes:$vivas = 1.234;$vivas = 23e4; # equivale a 230.000APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 69 -
    • StringsStrings podem ser atribuídas de duas maneiras: a. utilizando aspas simples ( ) Desta maneira, o valor da variável será exatamente o texto contido entre as aspas (com exceção de e ver tabela abaixo) b. utilizando aspas duplas ( " ) Desta maneira, qualquer variável ou caracter de escape será expandido antes de ser atribuído.Exemplo:<?$teste = "Mauricio";$vivas = ---$teste--n;echo "$vivas";?>A saída desse script será "---$teste--n".<?$teste = "Mauricio";$vivas = "---$teste---n";echo "$vivas";?>A saída desse script será "---Mauricio--" (com uma quebra de linha no final).A tabela seguinte lista os caracteres de escape: Sintaxe Significado n Nova linha r Retorno de carro (semelhante a n) t Tabulação horizontal A própria barra ( ) $ O símbolo $ Aspa simples " Aspa duplaNo apêndice 01 está disponível uma lista das funções utilizadas no tratamento de strings.ArraysArrays em PHP podem ser observados como mapeamentos ou como vetores indexados. Maisprecisamente, um valor do tipo array é um dicionário onde os índices são as chaves de acesso.Vale ressaltar que os índices podem ser valores de qualquer tipo e não somente inteiros.Inclusive, se os índices forem todos inteiros, estes não precisam formar um intervalo contínuoComo a checagem de tipos em PHP é dinâmica, valores de tipos diferentes podem ser usadoscomo índices de array, assim como os valores mapeados também podem ser de diversos tipos.Exemplo:<?APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 70 -
    • $cor[1] = "vermelho";$cor[2] = "verde";$cor[3] = "azul";$cor["teste"] = 1;?>Equivalentemente, pode-se escrever:<?$cor = array(1 => "vermelho, 2 => "verde, 3 => "azul", "teste => 1);?>ListasAs listas são utilizadas em PHP para realizar atribuições múltiplas. Através de listas é possívelatribuir valores que estão num array para variáveis. Vejamos o exemplo:Exemplo:list($a, $b, $c) = array("a", "b", "c");O comando acima atribui valores às três variáveis simultaneamente. É bom notar que só sãoatribuídos às variáveis da lista os elementos do array que possuem índices inteiros e nãonegativos. No exemplo acima as três atribuições foram bem sucedidas porque ao inicializar umarray sem especificar os índices eles passam a ser inteiros, a partir do zero. Um fator importanteé que cada variável da lista possui um índice inteiro e ordinal, iniciando com zero, que serve paradeterminar qual valor será atribuído. No exemplo anterior temos $a com índice 0, $b com índice1 e $c com índice 2. Vejamos um outro exemplo:$arr = array(1=>"um",3=>"tres","a"=>"letraA",2=>"dois);list($a,$b,$c,$d) = $arr;Após a execução do código acima temos os seguintes valores:$a == null$b == "um"$c == "dois"$d == "tres"Devemos observar que à variável $a não foi atribuído valor, pois no array não existe elementocom índice 0 (zero). Outro detalhe importante é que o valor "tres" foi atribuído à variável $d, enão a $b, pois seu índice é 3, o mesmo que $d na lista. Por fim, vemos que o valor "letraA" nãofoi atribuído a elemento algum da lista pois seu índice não é inteiro.Os índices da lista servem apenas como referência ao interpretador PHP para realizar asatribuições, não podendo ser acessados de maneira alguma pelo programador. De maneiradiferente do array, uma lista não pode ser atribuída a uma variável, servindo apenas para fazermúltiplas atribuições através de um array.No apêndice 02 está disponível uma lista das funções mais comuns para o tratamento de arrays.ObjetosUm objeto pode ser inicializado utilizando o comando new para instanciar uma classe para umavariável.Exemplo:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 71 -
    • class teste {function nada() {echo "nada";}}$vivas = new teste;$vivas -> nada();A utilização de objetos será mais detalhada mais à frente.BooleanosPHP não possui um tipo booleano, mas é capaz de avaliar expressões e retornar true ou false,através do tipo integer: é usado o valor 0 (zero) para representar o estado false, e qualquer valordiferente de zero (geralmente 1) para representar o estado true.Transformação de tiposA transformação de tipos em PHP pode ser feita das seguintes maneiras:CoerçõesQuando ocorrem determinadas operações ("+", por exemplo) entre dois valores de tiposdiferentes, o PHP converte o valor de um deles automaticamente (coerção). É interessante notarque se o operando for uma variável, seu valor não será alterado.O tipo para o qual os valores dos operandos serão convertidos é determinado da seguinte forma:Se um dos operandos for float, o outro será convertido para float, senão, se um deles for integer,o outro será convertido para integer.Exemplo:$vivas = "1"; // $vivas é a string "1"$vivas = $vivas + 1; // $vivas é o integer 2$vivas = $vivas + 3.7;// $vivas é o double 5.7$vivas = 1 + 1.5 // $vivas é o double 2.5Como podemos notar, o PHP converte string para integer ou double mantendo o valor. O sistemautilizado pelo PHP para converter de strings para números é o seguinte: o É analisado o início da string. Se contiver um número, ele será avaliado. Senão, o valor será 0 (zero); o O número pode conter um sinal no início ("+" ou "-"); o Se a string contiver um ponto em sua parte numérica a ser analisada, ele será considerado, e o valor obtido será double; o Se a string contiver um "e" ou "E" em sua parte numérica a ser analisada, o valor seguinte será considerado como expoente da base 10, e o valor obtido será double;Exemplos:$vivas = 1 + "10.5"; // $vivas == 11.5$vivas = 1 + "-1.3e3"; // $vivas == -1299$vivas = 1 + "teste10.5"; // $vivas == 1APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 72 -
    • $vivas = 1 + "10testes"; // $vivas == 11$vivas = 1 + " 10testes"; // $vivas == 11$vivas = 1 + "+ 10testes"; // $vivas == 1Transformação explícita de tiposA sintaxe do typecast de PHP é semelhante ao C: basta escrever o tipo entre parenteses antes dovalorExemplo:$vivas = 15; // $vivas é integer (15)$vivas = (double) $vivas // $vivas é double (15.0)$vivas = 3.9 // $vivas é double (3.9)$vivas = (int) $vivas // $vivas é integer (3) // o valor decimal é truncadoOs tipos de cast permitidos são:(int), (integer) muda para integer;(real), (double), (float) muda para float;(string) muda para string;(array) muda para array;(object) muda para objeto.Com a função settypeA função settype converte uma variável para o tipo especificado, que pode ser "integer","double", "string", "array" ou "object".Exemplo:$vivas = 15; // $vivas é integersettype($vivas,double) // $vivas é double 05. OperadoresAritméticosSó podem ser utilizados quando os operandos são números (integer ou float). Se forem de outrotipo, terão seus valores convertidos antes da realização da operação. + adição - subtração * multiplicação / divisão % módulode stringsSó há um operador exclusivo para strings: . concatenaçãoAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 73 -
    • de atribuiçãoExiste um operador básico de atribuição e diversos derivados. Sempre retornam o valoratribuído. No caso dos operadores derivados de atribuição, a operação é feita entre os doisoperandos, sendo atribuído o resultado para o primeiro. A atribuição é sempre por valor, e nãopor referência. = atribuição simples += atribuição com adição -= atribuição com subtração *= atribuição com multiplicação /= atribuição com divisão %= atribuição com módulo .= atribuição com concatenaçãoExemplo:$a = 7;$a += 2; // $a passa a conter o valor 9bit a bitComparam dois números bit a bit. & "e" lógico | "ou" lógico ^ ou exclusivo ~ não (inversão) << shift left >> shift rightLógicosUtilizados para inteiros representando valores booleanos and "e" lógico or "ou" lógico xor ou exclusivo ! não (inversão) && "e" lógico || "ou" lógicoExistem dois operadores para "e" e para "ou porque eles têm diferentes posições na ordem deprecedência.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 74 -
    • ComparaçãoAs comparações são feitas entre os valores contidos nas variáveis, e não as referências. Sempreretornam um valor booleano. == igual a != diferente de < menor que > maior que <= menor ou igual a >= maior ou igual aExpressão condicionalExiste um operador de seleção que é ternário. Funciona assim:(expressao1)?(expressao2):( expressao3)o interpretador PHP avalia a primeira expressão. Se ela for verdadeira, a expressão retorna ovalor de expressão2. Senão, retorna o valor de expressão3.de incremento e decremento ++ incremento -- decrementoPodem ser utilizados de duas formas: antes ou depois da variável. Quando utilizado antes,retorna o valor da variável antes de incrementá-la ou decrementá-la. Quando utilizado depois,retorna o valor da variável já incrementado ou decrementado.Exemplos:$a = $b = 10; // $a e $b recebem o valor 10$c = $a++; // $c recebe 10 e $a passa a ter 11$d = ++$b; // $d recebe 11, valor de $b já incrementado 06. Estruturas de ControleAs estruturas que veremos a seguir são comuns para as linguagens de programação imperativas,bastando, portanto, descrever a sintaxe de cada uma delas, resumindo o funcionamento.BlocosUm bloco consiste de vários comandos agrupados com o objetivo de relacioná-los comdeterminado comando ou função. Em comandos como if, for, while, switch e em declarações defunções blocos podem ser utilizados para permitir que um comando faça parte do contextodesejado. Blocos em PHP são delimitados pelos caracteres "{" e "}". A utilização dosAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 75 -
    • delimitadores de bloco em uma parte qualquer do código não relacionada com os comandoscitados ou funções não produzirá efeito algum, e será tratada normalmente pelo interpretador.Exemplo:if ($x == $y)comando1;comando2;Para que comando2 esteja relacionado ao if é preciso utilizar um bloco:if ($x == $y){comando1;comando2;}Comandos de seleçãoTambém chamados de condicionais, os comandos de seleção permitem executar comandos oublocos de comandos com base em testes feitos durante a execução.ifO mais trivial dos comandos condicionais é o if. Ele testa a condição e executa o comandoindicado se o resultado for true (valor diferente de zero). Ele possui duas sintaxes:if (expressão)comando;if (expressão):comando;...comando;endif;Para incluir mais de um comando no if da primeira sintaxe, é preciso utilizar um bloco,demarcado por chaves.O else é um complemento opcional para o if. Se utilizado, o comando será executado se aexpressão retornar o valor false (zero). Suas duas sintaxes são:if (expressão)comando;elsecomando;if (expressão):comando;...comando;elsecomando;...comando;endif;APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 76 -
    • A seguir, temos um exemplo do comando if utilizado com else:if ($a > $b)$maior = $a;else$maior = $b;O exemplo acima coloca em $maior o maior valor entre $a e $bEm determinadas situações é necessário fazer mais de um teste, e executar condicionalmentediversos comandos ou blocos de comandos. Para facilitar o entendimento de uma estrutura dotipo:if (expressao1)comando1;elseif (expressao2)comando2;elseif (expressao3)comando3;elsecomando4;Foi criado o comando, também opcional elseif. Ele tem a mesma função de um else e um ifusados sequencialmente, como no exemplo acima. Num mesmo if podem ser utilizados diversoselseifs, ficando essa utilização a critério do programador, que deve zelar pela legibilidade de seuscript.O comando elseif também pode ser utilizado com dois tipos de sintaxe. Em resumo, a sintaxegeral do comando if fica das seguintes maneiras:if (expressao1)comando;[ elseif (expressao2)comando; ][ elsecomando; ]if (expressao1) :comando;...comando;[ elseif (expressao2)comando;...APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 77 -
    • comando; ][ elsecomando;...comando; ]endif;switchO comando switch atua de maneira semelhante a uma série de comandos if na mesma expressão.Frequentemente o programador pode querer comparar uma variável com diversos valores, eexecutar um código diferente a depender de qual valor é igual ao da variável. Quando isso fornecessário, deve-se usar o comando switch. O exemplo seguinte mostra dois trechos de códigoque fazem a mesma coisa, sendo que o primeiro utiliza uma série de ifs e o segundo utilizaswitch:if ($i == 0)print "i é igual a zero";elseif ($i == 1)print "i é igual a um";elseif ($i == 2)print "i é igual a dois";switch ($i) {case 0:print "i é igual a zero";break;case 1:print "i é igual a um";break;case 2:print "i é igual a dois";break;}É importante compreender o funcionamento do switch para não cometer enganos. O comandoswitch testa linha a linha os cases encontrados, e a partir do momento que encontra um valorigual ao da variável testada, passa a executar todos os comandos seguintes, mesmo os que fazemparte de outro teste, até o fim do bloco. por isso usa-se o comando break, quebrando o fluxo efazendo com que o código seja executado da maneira desejada. Veremos mais sobre o breakmais adiante. Veja o exemplo:switch ($i) {case 0:print "i é igual a zero";case 1:print "i é igual a um";case 2:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 78 -
    • print "i é igual a dois";}No exemplo acima, se $i for igual a zero, os três comandos "print" serão executados. Se $i forigual a 1, os dois últimos "print" serão executados. O comando só funcionará da maneiradesejada se $i for igual a 2.Em outras linguagens que implementam o comando switch, ou similar, os valores a seremtestados só podem ser do tipo inteiro. Em PHP é permitido usar valores do tipo string comoelementos de teste do comando switch. O exemplo abaixo funciona perfeitamente:switch ($s) {case "casa":print "A casa é amarela";case "arvore":print "a árvore é bonita";case "lampada":print "joao apagou a lampada";}comandos de repetiçãowhileO while é o comando de repetição (laço) mais simples. Ele testa uma condição e executa umcomando, ou um bloco de comandos, até que a condição testada seja falsa. Assim como o if, owhile também possui duas sintaxes alternativas:while (<expressao>)<comando>;while (<expressao>):<comando>;...<comando>;endwhile;A expressão só é testada a cada vez que o bloco de instruções termina, além do teste inicial. Se ovalor da expressão passar a ser false no meio do bloco de instruções, a execução segue até o finaldo bloco. Se no teste inicial a condição for avaliada como false, o bloco de comandos não seráexecutado.O exemplo a seguir mostra o uso do while para imprimir os números de 1 a 10:$i = 1;while ($i <=10)print $i++;do... whileAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 79 -
    • O laço do..while funciona de maneira bastante semelhante ao while, com a simples diferença quea expressão é testada ao final do bloco de comandos. O laço do..while possui apenas umasintaxe, que é a seguinte:do {<comando>...<comando>} while (<expressao>);O exemplo utilizado para ilustrar o uso do while pode ser feito da seguinte maneira utilizando odo.. while:$i = 0;do {print ++$i;} while ($i < 10);forO tipo de laço mais complexo é o for. Para os que programam em C, C++ ou Java, a assimilaçãodo funcionamento do for é natural. Mas para aqueles que estão acostumados a linguagens comoPascal, há uma grande mudança para o uso do for. As duas sintaxes permitidas são:for (<inicializacao>;<condicao>;<incremento>)<comando>;for (<inicializacao>;<condicao>;<incremento>) :<comando>;...<comando>;endfor;As três expressões que ficam entre parênteses têm as seguintes finalidades:Inicialização: comando ou sequencia de comandos a serem realizados antes do inicio do laço.Serve para inicializar variáveis.Condição: Expressão booleana que define se os comandos que estão dentro do laço serãoexecutados ou não. Enquanto a expressão for verdadeira (valor diferente de zero) os comandosserão executados.Incremento: Comando executado ao final de cada execução do laço.Um comando for funciona de maneira semelhante a um while escrito da seguinte forma:<inicializacao>while (<condicao>) {comandos...<incremento>}APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 80 -
    • Quebra de fluxoBreakO comando break pode ser utilizado em laços de do, for e while, além do uso já visto nocomando switch. Ao encontrar um break dentro de um desses laços, o interpretador PHP paraimediatamente a execução do laço, seguindo normalmente o fluxo do script.while ($x > 0) {...if ($x == 20) {echo "erro! x = 20";break;...}No trecho de código acima, o laço while tem uma condição para seu término normal ($x <= 0),mas foi utilizado o break para o caso de um término não previsto no início do laço. Assim ointerpretador seguirá para o comando seguinte ao laço.ContinueO comando continue também deve ser utilizado no interior de laços, e funciona de maneirasemelhante ao break, com a diferença que o fluxo ao invés de sair do laço volta para o iníciodele. Vejamos o exemplo:for ($i = 0; $i < 100; $i++) {if ($i % 2) continue;echo " $i ";}O exemplo acima é uma maneira ineficiente de imprimir os números pares entre 0 e 99. O que olaço faz é testar se o resto da divisão entre o número e 2 é 0. Se for diferente de zero (valorlógico true) o interpretador encontrará um continue, que faz com que os comandos seguintes dointerior do laço sejam ignorados, seguindo para a próxima iteração. 07. FunçõesDefinindo funçõesA sintaxe básica para definir uma função é:function nome_da_função([arg1, arg2, arg3]) {Comandos;... ;[return <valor de retorno>];}Qualquer código PHP válido pode estar contido no interior de uma função. Como a checagem detipos em PHP é dinâmica, o tipo de retorno não deve ser declarado, sendo necessário que oprogramador esteja atento para que a função retorne o tipo desejado. É recomendável que estejatudo bem documentado para facilitar a leitura e compreensão do código. Para efeito dedocumentação, utiliza-se o seguinte formato de declaração de função:tipo function nome_da_funcao(tipo arg1, tipo arg2, ...);APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 81 -
    • Este formato só deve ser utilizado na documentação do script, pois o PHP não aceita adeclaração de tipos. Isso significa que em muitos casos o programador deve estar atento ao tiposdos valores passados como parâmetros, pois se não for passado o tipo esperado não é emitidonenhum alerta pelo interpretador PHP, já que este não testa os tipos.Valor de retornoToda função pode opcionalmente retornar um valor, ou simplesmente executar os comandos enão retornar valor algum.Não é possível que uma função retorne mais de um valor, mas é permitido fazer com que umafunção retorne um valor composto, como listas ou arrays.ArgumentosÉ possível passar argumentos para uma função. Eles devem ser declarados logo após o nome dafunção, entre parênteses, e tornam-se variáveis pertencentes ao escopo local da função. Adeclaração do tipo de cada argumento também é utilizada apenas para efeito de documentação.Exemplo:function imprime($texto){echo $texto;}imprime("teste de funções");Passagem de parâmetros por referênciaNormalmente, a passagem de parâmetros em PHP é feita por valor, ou seja, se o conteúdo davariável for alterado, essa alteração não afeta a variável original.Exemplo:function mais5($numero) {$numero += 5;}$a = 3;mais5($a); //$a continua valendo 3No exemplo acima, como a passagem de parâmetros é por valor, a função mais5 é inútil, já queapós a execução sair da função o valor anterior da variável é recuperado. Se a passagem de valorfosse feita por referência, a variável $a teria 8 como valor. O que ocorre normalmente é que aoser chamada uma função, o interpretador salva todo o escopo atual, ou seja, os conteúdos dasvariáveis. Se uma dessas variáveis for passada como parâmetro, seu conteúdo fica preservado,pois a função irá trabalhar na verdade com uma cópia da variável. Porém, se a passagem deparâmetros for feita por referência, toda alteração que a função realizar no valor passado comoparâmetro afetará a variável que o contém.Há duas maneiras de fazer com que uma função tenha parâmetros passados por referência:indicando isso na declaração da função, o que faz com que a pasagem de parâmetros sempre sejaassim; e também na própria chamada da função. Nos dois casos utiliza-se o modificador "&".Vejamos um exemplo que ilustra os dois casos:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 82 -
    • function mais5(&$num1, $num2) {$num1 += 5;$num2 += 5;}$a = $b = 1;mais5($a, $b); /* Neste caso, só $num1 terá seu valor alterado, pois a passagem por referênciaestá definida na declaração da função. */mais5($a, &$b); /* Aqui as duas variáveis terão seus valores alterados. */Argumentos com valores pré-definidos (default)Em PHP é possível ter valores default para argumentos de funções, ou seja, valores que serãoassumidos em caso de nada ser passado no lugar do argumento. Quando algum parâmetro édeclarado desta maneira, a passagem do mesmo na chamada da função torna-se opcional.function teste($vivas = "testando") {echo $vivas;}teste(); // imprime "testando"teste("outro teste"); // imprime "outro teste"É bom lembrar que quando a função tem mais de um parâmetro, o que tem valor default deve serdeclarado por último:function teste($figura = circulo, $cor) {echo "a figura é um ", $figura, " de cor " $cor;}teste(azul);/* A função não vai funcionar da maneira esperada, ocorrendo um erro no interpretador. Adeclaração correta é: */function teste2($cor, $figura = circulo) {echo "a figura é um ", $figura, " de cor " $cor;}teste2(azul);/* Aqui a funcao funciona da maneira esperada, ou seja, imprime o texto: "a figura é um círculode cor azul" */ContextoO contexto é o conjunto de variáveis e seus respectivos valores num determinado ponto doprograma. Na chamada de uma função, ao iniciar a execução do bloco que contém aimplementação da mesma é criado um novo contexto, contendo as variáveis declaradas dentro dobloco, ou seja, todas as variáveis utilizadas dentro daquele bloco serão eliminadas ao término daexecução da função.EscopoO escopo de uma variável em PHP define a porção do programa onde ela pode ser utilizada. Namaioria dos casos todas as variáveis têm escopo global. Entretanto, em funções definidas pelousuário um escopo local é criado. Uma variável de escopo global não pode ser utilizada nointerior de uma função sem que haja uma declaração.Exemplo:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 83 -
    • $vivas = "Testando";function Teste() {echo $vivas;}Teste();O trecho acima não produzirá saída alguma, pois a variável $vivas é de escopo global, e nãopode ser referida num escopo local, mesmo que não haja outra com nome igual que cubra a suavisibilidade. Para que o script funcione da forma desejada, a variável global a ser utilizada deveser declarada.Exemplo:$vivas = "Testando";function Teste() {global $vivas;echo $vivas;}Teste();Uma declaração "global" pode conter várias variáveis, separadas por vírgulas. Uma outramaneira de acessar variáveis de escopo global dentro de uma função é utilizando um array pré-definido pelo PHP cujo nome é $GLOBALS. O índice para a variável referida é o proprio nomeda variável, sem o caracter $. O exemplo acima e o abaixo produzem o mesmo resultado:Exemplo:$vivas = "Testando";function Teste() {echo $GLOBALS["vivas"]; // imprime $vivasecho $vivas; // não imprime nada}Teste(); 08. Variáveis e ConstantesDeclaração de uma variávelComo a tipagem em PHP é dinâmica, as variáveis não precisam ser declaradas. Uma variável éinicializada no momento em que é feita a primeira atribuição. O tipo da variável será definido deacordo com o valor atribuído.O modificador staticUma variável estática é visível num escopo local, mas ela é inicializada apenas uma vez e seuvalor não é perdido quando a execução do script deixa esse escopo. Veja o seguinte exemplo:function Teste() {$a = 0;echo $a;$a++;}APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 84 -
    • O último comando da função é inútil, pois assim que for encerrada a execução da função avariável $a perde seu valor. Já no exemplo seguinte, a cada chamada da função a variável $a teráseu valor impresso e será incrementada:function Teste() {static $a = 0;echo $a;$a++;}O modificador static é muito utilizado em funções recursivas, já que o valor de algumas variáveisprecisa ser mantido. Ele funciona da seguinte forma: O valor das variáveis declaradas comoestáticas é mantido ao terminar a execução da função. Na próxima execução da função, aoencontrar novamente a declaração com static, o valor da variável é recuperado.Em outras palavras, uma variável declarada como static tem o mesmo "tempo de vida" que umavariável global, porém sua visibilidade é restrita ao escopo local em que foi declarada e só érecuperada após a declaração.Exemplo:function Teste() {echo "$a";static $a = 0;$a++;}O exemplo acima não produzirá saída alguma. Na primeira execução da função, a impressãoocorre antes da atribuição de um valor à função, e portanto o conteúdo de $a é nulo (stringvazia). Nas execuções seguintes da função Teste() a impressão ocorre antes da recuperação dovalor de $a, e portanto nesse momento seu valor ainda é nulo. Para que a função retorne algumvalor o modificador static deve ser utilizado.Variáveis VariáveisO PHP tem um recurso conhecido como variáveis variáveis, que consiste em variáveis cujosnomes também são variáveis. Sua utilização é feita através do duplo cifrão ($$).$a = "teste";$$a = "Mauricio Vivas";O exemplo acima e equivalente ao seguinte:$a = "teste";$teste = "Mauricio Vivas";Variáveis enviadas pelo navegadorPara interagir com a navegação feita pelo usuário, é necessário que o PHP possa enviar e receberinformações para o software de navegação. A maneira de enviar informações, como já foi vistoanteriormente, geralmente é através de um comando de impressão, como o echo. Para receberinformações vindas do navegador através de um link ou um formulário html o PHP utiliza asinformações enviadas através da URL. Por exemplo: se seu script php está localizado em"http://localhost/teste.php3" e você o chama com a url "http://localhost/teste.php3?vivas=teste",automaticamente o PHP criará uma variável com o nome $vivas contendo a string "teste". NoteAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 85 -
    • que o conteúdo da variável está no formato urlencode. Os formulários html já enviaminformações automaticamente nesse formato, e o PHP decodifica sem necessitar de tratamentopelo programador.URLencodeO formato urlencode é obtido substituindo os espaços pelo caracter "+" e todos os outroscaracteres não alfa-numéricos (com exceção de "_") pelo caracter "%" seguido do código ASCIIem hexadecimal.Por exemplo: o texto "Testando 1 2 3 !!" em urlencode fica "Testando+1+2+3+%21%21"O PHP possui duas funções para tratar com texto em urlencode. Seguem suas sintaxes:string urlencode(string texto);string urldecode(string texto);Essas funções servem respectivamente para codificar ou decodificar um texto passado comoargumento. Para entender melhor o que é um argumento e como funciona uma função, leia otópico "funções".Utilizando arraysCada elemento de um formulário HTML submetido a um script PHP cria no ambiente do mesmouma variável cujo nome é o mesmo nome do elemento. Por exemplo: um campo definido como:<input type="text" name="endereco">ao ser submetido a um script PHP fará com que seja criada uma variável com o nome $endereco.Isto acontece de forma semelhante para cookies, como veremos mais adiante.Uma boa técnica de programação é utilizar a notação de arrays para nomes de cookies ou itensde um formulário html. Para um conjunto de checkboxes, por exemplo, podemos utilizar aseguinte notação:<input type="checkbox" name="teste[]" value="valor1">opcao1<input type="checkbox" name="teste[]" value="valor2">opcao2<input type="checkbox" name="teste[]" value="valor3">opcao3<input type="checkbox" name="teste[]" value="valor4">opcao4<input type="checkbox" name="teste[]" value="valor5">opcao5Ao submeter o formulário, o script que recebe os valores submetidos terá uma variável chamada$teste contendo os valores marcados num array, com índices a partir de zero. Assim, se foremmarcadas as opçoes 2, 3 e 5, poderemos fazer as seguintes afirmações:$teste == array("valor2", "valor3", valor5");$teste[0] == "valor2;$teste[1] == "valor3;$teste[2] == "valor5;O mesmo artifício pode ser utilizado com outros elementos de formulários e até com cookies.Variáveis de ambienteO PHP possui diversas variáveis de ambiente, como a $PHP_SELF, por exemplo, que contém onome e o path do próprio arquivo. Algumas outras contém informações sobre o navegador dousuário, o servidor http, a versão do PHP e diversas informações. Para ter uma listagem de todasas variáveis e constantes de ambiente e seus respectivos conteúdos, deve-se utilizar a funçãophpinfo().APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 86 -
    • Verificando o tipo de uma variávelPor causa da tipagem dinâmica utilizada pelo PHP, nem sempre é possível saber qual o tipo deuma variável em determinado instantese não contar com a ajuda de algumas funções que ajudama verificar isso. A verificação pode ser feita de duas maneiras:Função que retorna o tipo da variávelEsta função é a gettype. Sua assinatura é a seguinte:string gettype(mixed var);A palavra "mixed" indica que a variável var pode ser de diversos tipos.A função gettype pode retornar as seguintes strings: "integer", "double", "string", "array","object" e "unknown type".Funções que testam o tipo da variávelSão as funções is_int, is_integer, is_real, is_long, is_float, is_string, is_array e is_object. Todastêm o mesmo formato, seguindo modelo da assinatura a seguir:int is_integer(mixed var);Todas essas funções retornam true se a variável for daquele tipo, e false em caso contrário.Destruindo uma variávelÉ possível desalocar uma variável se ela não for usada posteriormente através da função unset,que tem a seguinte assinatura:int unset(mixed var);A função destrói a variável, ou seja, libera a memória ocupada por ela, fazendo com que eladeixe de existir. Se mais na frente for feita uma chamada á variável, será criada uma novavariável de mesmo nome e de conteúdo vazio, a não ser que a chamada seja pela função isset. Sea operação for bem sucedida, retorna true.Verificando se uma variável possui um valorExistem dois tipos de teste que podem ser feitos para verificar se uma variável está setada: com afunção isset e com a função empty.A função issetPossui o seguinte protótipo:int isset(mixed var);E retorna true se a variável estiver setada (ainda que com uma string vazia ou o valor zero), efalse em caso contrário.A função emptyPossui a seguinte assinatura:int empty(mixed var);E retorna true se a variável não contiver um valor (não estiver setada) ou possuir valor 0 (zero)ou uma string vazia. Caso contrário, retorna false.Constantes pré-definidasO PHP possui algumas constantes pré-definidas, indicando a versão do PHP, o SistemaOperacional do servidor, o arquivo em execução, e diversas outras informações. Para ter acesso aAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 87 -
    • todas as constantes pré-definidas, pode-se utilizar a função phpinfo(), que exibe uma tabelacontendo todas as constantes pré-definidas, assim como configurações da máquina, sistemaoperacional, servidor http e versão do PHP instalada.Definindo constantesPara definir constantes utiliza-se a função define. Uma vez definido, o valor de uma constantenão poderá mais ser alterado. Uma constante só pode conter valores escalares, ou seja, não podeconter nem um array nem um objeto. A assinatura da função define é a seguinte:int define(string nome_da_constante, mixed valor);A função retorna true se for bem-sucedida. Veja um exemplo de sua utilização a seguir:define ("pi", 3.1415926536);$circunf = 2*pi*$raio; 09. Classes e ObjetosClasseUma classe é um conjunto de variáveis e funções relacionadas a essas variáveis. Uma vantagemda utilização de programação orientada a objetos é poder usufruir do recurso de encapsulamentode informação. Com o encapsulamento o usuário de uma classe não precisa saber como ela éimplementada, bastando para a utilização conhecer a interface, ou seja, as funções disponíveis.Uma classe é um tipo, e portanto não pode ser atribuída a uma variável. Para definir uma classe,deve-se utilizar a seguinte sintaxe:class Nome_da_classe {var $variavel1;var $variavel2;function funcao1 ($parametro) {/* === corpo da função === */}}ObjetoComo foi dito anteriormente, classes são tipos, e não podem ser atribuídas a variáveis. Variáveisdo tipo de uma classe são chamadas de objetos, e devem ser criadas utilizando o operador new,seguindo o exemplo abaixo:$variavel = new $nome_da_classe;Para utilizar as funções definidas na classe, deve ser utilizado o operador "->", como noexemplo:$variavel->funcao1(A variável $thisNa definição de uma classe, pode-se utilizar a variável $this, que é o próprio objeto. Assim,quando uma classe é instanciada em um objeto, e uma função desse objeto na definição da classeutiliza a variável $this, essa variável significa o objeto que estamos utilizando.Como exemplo da utilização de classes e objetos, podemos utilizar a classe conta, que defineuma conta bancária bastante simples, com funções para ver saldo e fazer um crédito.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 88 -
    • class conta {var $saldo;function saldo() {return $this->saldo;}function credito($valor) {$this->saldo += $valor;}}$minhaconta = new conta;$minhaconta->saldo(); // a variavel interna não foi// inicializada, e não contém// valor algum$minhaconta->credito(50);$minhaconta->saldo(); // retorna 50SubClassesUma classe pode ser uma extensão de outra. Isso significa que ela herdará todas as variáveis efunções da outra classe, e ainda terá as que forem adicionadas pelo programador. Em PHP não épermitido utilizar herança múltipla, ou seja, uma classe pode ser extensão de apenas umaoutra.Para criar uma classe extendida, ou derivada de outra, deve ser utilizada a palavrareservada extends, como pode ser visto no exemplo seguinte:class novaconta extends conta {var $num;function numero() {return $this->num;}}A classe acima é derivada da classe conta, tendo as mesmas funções e variáveis, com a adição davariável $numero e a função numero().ConstrutoresUm construtor é uma função definida na classe que é automaticamente chamada no momento emque a classe é instanciada (através do operador new). O construtor deve ter o mesmo nome que aclasse a que pertence. Veja o exemplo:class conta {var $saldo;function conta () {$this.saldo = 0;}function saldo() {return $this->saldo;}function credito($valor) {APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 89 -
    • $this->saldo += $valor;}}Podemos perceber que a classe conta agora possui um construtor, que inicializa a variável $saldocom o valor 0.Um construtor pode conter argumentos, que são opcionais, o que torna esta ferramenta maispoderosa. No exemplo acima, o construtor da classe conta pode receber como argumento umvalor, que seria o valor inicial da conta.Vale observar que para classes derivadas, o construtor da classe pai não é automaticamenteherdado quando o construtor da classe derivada é chamado. 10. Noções de SQLIntroduçãoQuando os Bancos de Dados Relacionais estavam sendo desenvolvidos, foram criadaslinguagens destinadas à sua manipulação. O Departamento de Pesquisas da IBM, desenvolveu aSQL como forma de interface para o sistema de BD relacional denominado SYSTEM R, iníciodos anos 70. Em 1986 o American National Standard Institute ( ANSI ), publicou um padrãoSQL.A SQL estabeleceu-se como linguagem padrão de Banco de Dados Relacional.SQL apresenta uma série de comandos que permitem a definição dos dados, chamada de DDL(Data Definition Language), composta entre outros pelos comandos Create, que é destinado acriação do Banco de Dados, das Tabelas que o compõe, além das relações existentes entre astabelas. Como exemplo de comandos da classe DDL temos os comandos Create, Alter e Drop.Os comandos da série DML (Data Manipulation Language), destinados a consultas, inserções,exclusões e alterações em um ou mais registros de uma ou mais tabelas de maneira simultânea.Como exemplo de comandos da classe DML temos os comandos Select, Insert, Update e Delete.Uma subclasse de comandos DML, a DCL (Data Control Language), dispõe de comandos decontrole como Grant e Revoke.A Linguagem SQL tem como grandes virtudes sua capacidade de gerenciar índices, sem anecessidade de controle individualizado de índice corrente, algo muito comum nas linguagens demanipulação de dados do tipo registro a registro. Outra característica muito importantedisponível em SQL é sua capacidade de construção de visões, que são formas de visualizarmosos dados na forma de listagens independente das tabelas e organização lógica dos dados.Outra característica interessante na linguagem SQL é a capacidade que dispomos de cancelaruma série de atualizações ou de as gravarmos, depois de iniciarmos uma seqüência deatualizações. Os comandos Commit e Rollback são responsáveis por estas facilidades.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 90 -
    • Devemos notar que a linguagem SQL consegue implementar estas soluções, somente pelo fatode estar baseada em Banco de Dados, que garantem por si mesmo a integridade das relaçõesexistentes entre as tabelas e seus índices.Estrutura das tabelasComando CreateEste comando permite a criação de tabelas no banco de dados ou mesmo de sua criação.Sintaxe:CREATE DATABASE < nome_db >;onde:nome_db - indica o nome do Banco de Dados a ser criado.Sintaxe:CREATE TABLE < nome_tabela > (nome_atributo1 < tipo > [ NOT NULL ],nome_atributo2 < tipo > [ NOT NULL ],......nome_atributoN < tipo > [ NOT NULL ]);onde:nome_table - indica o nome da tabela a ser criada.nome_atributo - indica o nome do campo a ser criado na tabela.tipo - indica a definição do tipo de atributo ( integer(n), char(n), ... ).Comando DropEste comando elimina a definição da tabela, seus dados e referências.Sintaxe:DROP TABLE < nome_tabela > ;Comando AlterEste comando permite inserir/eliminar atributos nas tabelas já existentes.Comando:ALTER TABLE < nome_tabela > ADD / DROP (nome_atributo1 < tipo > [ NOT NULL ],nome_atributoN < tipo > [ NOT NULL ]);Manipulando dados das tabelasComando SELECTPermite recuperar informações existentes nas tabelas.Sintaxe básica:SELECT [DISTINCT] expressao [AS nom-atributo][FROM from-list][WHERE condicao]APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 91 -
    • [ORDER BY attr_name1 [ASC | DESC ]]onde:DISTINCT : Para eliminar linhas duplicadas na saída.Expressao: Define os dados que queremos na saída, normalmente uma ou mais colunas de umatabela da lista FROM.AS nom-atributo : um alias para o nome da coluna, exemplo:FROM : lista das tabelas na entradaWHERE : critérios da seleçãoORDER BY : Critério de ordenação das tabelas de saída. ASC ordem ascendente, DESC ordemdescendenteExemplo:SELECT cidade, estado from brasil where populacao > 100000;Comando INSERTAdiciona um ou vários registros a uma tabela. Isto é referido como consulta anexação.Sintaxe básicaINSERT INTO destino [(campo1[, campo2[, ...]])]VALUES (valor1[, valor2[, ...])A instrução INSERT INTO tem as partes abaixo:Destino- O nome da tabela ou consulta em que os registros devem ser anexados.campo1, campo2 - Os nomes dos campos aos quais os dados devem ser anexadosvalor1, valor2 - Os valores para inserir em campos específicos do novo registro. Cada valor éinserido no campo que corresponde à posição do valor na lista: Valor1 é inserido no campo1 donovo registro, valor2 no campo2 e assim por diante. Você deve separar os valores com umavírgula e colocar os campos de textos entre aspas (" ").Comando UPDATECria uma consulta atualização que altera os valores dos campos em uma tabela especificada combase em critérios específicos.Sintaxe:UPDATE tabelaSET campo1 = valornovo, ...WHERE critério;Onde:Tabela - O nome da tabela cujos os dados você quer modificar.Valornovo - Uma expressão que determina o valor a ser inserido em um campo específico nosregistros atualizados.critério - Uma expressão que determina quais registros devem ser atualizados. Só os registrosque satisfazem a expressão são atualizados.UPDATE é especialmente útil quando você quer alterar muitos registros ou quando os registrosque você quer alterar estão em várias tabelas. Você pode alterar vários campos ao mesmo tempo.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 92 -
    • UPDATE não gera um conjunto de resultados. Se você quiser saber quais resultados serãoalterados, examine primeiro os resultados da consulta seleção que use os mesmos critérios eentão execute a consulta atualização.Comando DELETERemove registros de uma ou mais tabelas listadas na cláusula FROM que satisfaz a cláusulaWHERE.SintaxeDELETE [tabela.*]FROM tabelaWHERE critérioonde:tabela.* - O nome opcional da tabela da qual os registros são excluídos.tabela - O nome da tabela da qual os registros são excluídos.critério - Uma expressão que determina qual registro deve ser excluído.DELETE é especialmente útil quando você quer excluir muitos registros. Para eliminar umatabela inteira do banco de dados, você pode usar o método Execute com uma instrução DROP.Entretanto, se você eliminar a tabela, a estrutura é perdida. Por outro lado, quando você usaDELETE, apenas os dados são excluídos. A estrutura da tabela e todas as propriedades da tabela,como atributos de campo e índices, permanecem intactos.Você pode usar DELETE para remover registros de tabelas que estão em uma relação um porvários com outras tabelas. Operações de exclusão em cascata fazem com que os registros dastabelas que estão no lado "vários" da relação sejam excluídos quando os registroscorrespondentes do lado "um" da relação são excluídos na consulta. Por exemplo, nas relaçõesentre as tabelas Clientes e Pedidos, a tabela Clientes está do lado "um" e a tabela Pedidos está nolado "vários" da relação. Excluir um registro em Clientes faz com que os registroscorrespondentes em Pedidos sejam excluídos se a opção de exclusão em cascata for especificada.O DELETE exclui registros inteiros e não apenas dados em campos específicos. Se você quiserexcluir valores de um campo específico, crie uma consulta atualização que mude os valores paraNull.Após remover os registros usando uma consulta exclusão, você não poderá desfazer a operação.Se quiser saber quais arquivos foram excluídos, primeiro examine os resultados de uma consultaseleção que use o mesmo critério e então, execute a consulta exclusão. Mantenha os backups deseus dados. Se você excluir os registros errados, poderá recuperá-los a partir dos seus backups. 11. Acessando o mySQL via PHPEstabelecendo conexõesPara acessar bases de dados num servidor mySQL, é necessário antes estabelecer uma conexão.Para isso, deve ser utilizado o comando mysql_connect, ou o mysql_pconnect. A diferença entreos dois comandos é que o mysql_pconnect estabelece uma conexão permanente, ou seja, que nãoAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 93 -
    • é encerrada ao final da execução do script. As assinaturas dos dois comandos são semelhantes,como pode ser verificado a seguir:int mysql_connect(string [host[:porta]] , string [login] , string [senha] );int mysql_pconnect(string [host[:porta]] , string [login] , string [senha] );O valor de retorno é um inteiro que identifica a conexão, ou falso se a conexão falhar. Antes detentar estabelecer uma conexão, o interpretador PHP verifica se já existe uma conexãoestabelecida com o mesmo host, o mesmo login e a mesma senha. Se existir, o identificadordesta conexão é retornado. Senão, uma nova conexão é criada.Uma conexão estabelecida com o comando mysql_connect é encerrada ao final da execução doscript. Para encerrá-la antes disso deve ser utilizado o comando mysql_close, que tem a seguinteassinatura:int mysql_close(int [identificador da conexão] );Se o identificador não for fornecido, a última conexão estabelecida será encerrada.IMPORTANTE: o comando mysql_close não encerra conexões estabelecidas com o comandomysql_pconnect.Selecionando a base de dadosDepois de estabelecida a conexão, é preciso selecionar a base de dados a ser utilizada, através docomando mysql_select_db, que segue o seguinte modelo:int mysql_select_db(string base, int [conexao] );Novamente, se o identificador da conexão não for fornecido, a última conexão estabelecida seráutilizada.Realizando consultasPara executar consultas SQL no mySQL, utiliza-se o comando mysql_query, que tem a seguinteassinatura:int mysql_query(string query, int [conexao] );Onde query é a expressão SQL a ser executada, sem o ponto-e-vírgula no final, e conexao é oidentificador da conexão a ser utilizada. A consulta será executada na base de dados selecionadapelo comando mysql_select_db.É bom lembrar que uma consulta não significa apenas um comando SELECT. A consulta podeconter qualquer comando SQL aceito pelo banco.O valor de retorno é falso se a expressão SQL for incorreta, e diferente de zero se for correta. Nocaso de uma expressão SELECT, as linhas retornadas são armazenadas numa memória deresultados, e o valor de retorno é o identificador do resultado. Alguns comandos podem serrealizados com esse resultado:Apagando o resultadoint mysql_free_result(int result);O comando mysql_free-result deve ser utilizado para apagar da memória o resultado indicado.Número de linhasAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 94 -
    • int mysql_num_rows(int result);O comando mysql_num_rows retorna o número de linhas contidas num resultado.Utilizando os resultadosExistem diversas maneiras de ler os resultados de uma query SELECT. As mais comuns serãovistas a seguir:int mysql_result(int result, int linha, mixed [campo] );Retorna o conteúdo de uma célula da tabela de resultados.result é o identificador do resultado;linha é o número da linha, iniciado por 0;campo é uma string com o nome do campo, ou um número correspondente ao número da coluna.Se foi utilizado um alias na consulta, este deve ser utilizado no comando mysql_result.Este comando deve ser utilizado apenas para resultados pequenos. Quando o volume de dadosfor maior, é recomendado utilizar um dos métodos a seguir:array mysql_fetch_array(int result);Lê uma linha do resultado e devolve um array, cujos índices são os nomes dos campos. Aexecução seguinte do mesmo comando lerá a próxima linha, até chegar ao final do resultado.array mysql_fetch_row(int result);Semelhante ao comando anterior, com a diferença que os índices do array são numéricos,iniciando pelo 0 (zero).Alterando o ponteiro de um resultadoint mysql_data_seek(int result, int numero);Cada resultado possui um "ponteiro", que indica qual será a próxima linha lida com o comandomysql_fetch_row (ou mysql_fetch_array). Para alterar a posição indicada por esse ponteiro deveser utilizada a função mysql_data_seek, sendo que o número da primeira linha de um resultado ézero. 12. Acessando o PostgreSQL via PHPEstabelecendo conexõesPara acessar bases de dados num servidor Postgres, é necessário antes estabelecer uma conexão.Para isso, deve ser utilizado o comando pg_connect, ou o pg_pconnect. A diferença entre os doiscomandos é que o pg_pconnect estabelece uma conexão permanente, ou seja, que não éencerrada ao final da execução do script. As assinaturas dos dois comandos são semelhantes,como pode ser verificado a seguir:int pg_connect(string host, string porta, string opcoes, string tty, string db);int pg_pconnect(string host, string porta, string opcoes, string tty, string db);APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 95 -
    • O valor de retorno é um inteiro que identifica a conexão, ou falso se a conexão falhar. Umaconexão estabelecida com o comando pg_connect é encerrada ao final da execução do script.Para encerrá-la antes disso deve ser utilizado o comando pg_close, que tem a seguinte assinatura:int pg_close(int identificador da conexão );IMPORTANTE: o comando pg_close não encerra conexões estabelecidas com o comandopg_pconnect.Os comandos pg_connect e pg_pconnect também podem ser utilizados da seguinte forma:pg_connect("dbname=db port=n host="localhost" tty="tty" options=opcoes user=usuariopassword=senha");Realizando consultasPara executar consultas SQL no Postgres, utiliza-se o comando pg_exec, que tem a seguinteassinatura:int pg_exec(int conexao, string query );Onde query é a expressão SQL a ser executada, sem o ponto-e-vírgula no final, e conexao é oidentificador da conexão a ser utilizada. A consulta será executada na base de dados selecionadaquando for efetuada a conexão com o banco. Para saber qual a base de dados selecionada, bastautilizar a função string pg_dbname, que tem a seguinte assinatura:string pg_dbname(int conexão);É bom lembrar que uma consulta não significa apenas um comando SELECT. A consulta podeconter qualquer comando SQL aceito pelo banco.O valor de retorno é falso se a expressão SQL for incorreta, e diferente de zero se for correta. Nocaso de uma expressão SELECT, as linhas retornadas são armazenadas numa memória deresultados, e o valor de retorno é o identificador do resultado. Alguns comandos podem serrealizados com esse resultado:Verificando o erro na execução de uma queryPara ter acesso à mensagem de erro no caso de falha na execução de uma query SQl, bastautilizar o comando pg_errormessage():string pg_errormessage(int connection);Apagando o resultadoint pg_freeresult(int result);O comando pg_freeresult deve ser utilizado para apagar da memória o resultado indicado. NoPHP 4, este comando tornou-se obsoleto, já que o interpretador trata de apagar o resultadoautomaticamente em caso de não ser mais utilizado.Número de linhasint pg_numrows(int result);O comando pg_numrows retorna o número de linhas contidas num resultado.Utilizando os resultadosAPOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 96 -
    • Existem diversas maneiras de ler os resultados de uma query SELECT. As mais comuns serãovistas a seguir:int pg_result(int result, int linha, mixed [campo] );Retorna o conteúdo de uma célula da tabela de resultados.result é o identificador do resultado;linha é o número da linha, iniciado por 0;campo é uma string com o nome do campo, ou um número correspondente ao número da coluna.Se foi utilizado um alias na consulta, este deve ser utilizado no comando pg_result.Este comando deve ser utilizado apenas para resultados pequenos. Quando o volume de dadosfor maior, é recomendado utilizar um dos métodos a seguir:array pg_fetch_array(int result, int linha);Lê uma linha do resultado e devolve um array, cujos índices são os nomes dos campos. O índicedas linhas é iniciado por zero.array pg_fetch_row(int result, int linha);Semelhante ao comando anterior, com a diferença que os índices do array são numéricos,iniciando pelo 0 (zero).16. Utilizando headersO comando header permite enviar cabeçalhos html para o cliente. Deve ser utilizado por usuáriosque conheçam a função de cada header que pode ser enviado. Não pode ser enviado depois dealgum texto. veja o seguinte exemplo:<html><? header("Location: http://www.php.net"); ?><body>...O código acima causará um erro, já que tentou-se enviar um header depois de ter sido enviadoum texto("<html>n").A sintaxe do comando header é bastante simples:int header(string header);Algumas utilizações do header são://redirecionar para outra página:header("Location: http://www.php.net");// Definir o script como uma mensagem de erro:header("http/1.0 404 Not Found");// Definir a expiração da página:header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1 header("Pragma: no-cache"); //HTTP/1.0Para obter uma lista completa dos headers HTTP, visite o seguinte endereço:http://www.w3.org/Protocols/rfc2068/rfc2068APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 97 -
    • 13. Utilizando cookiesO que sãoCookies são variáveis gravadas no cliente(browser) por um determinado site. Somente o site quegravou o cookie pode ler a informação contida nele. Este recurso é muito útil para quedeterminadas informações sejam fornecidas pelo usuário apenas uma vez. Exemplos deutilização de cookies são sites que informam a quantidade de vezes que você já visitou, oualguma informação fornecida numa visita anterior.Existem cookies persistentes e cookies de sessão. Os persistentes são aqueles gravados emarquivo, e que permanecem após o browser ser fechado, e possuem data e hora de expiração. Oscookies de sessão não são armazenados em disco e permanecem ativos apenas enquanto a sessãodo browser não for encerrada.Por definição, existem algumas limitações para o uso de cookies, listadas a seguir: o 300 cookies no total o 4 kilobytes por cookie. o 20 cookies por servidor ou domínio.Gravando cookiesPara gravar cookies no cliente, deve ser utilizada a função setcookie, que possui a seguinteassinatura:int setcookie(string nome, string valor, int exp, string path, string dominio, int secure);onde:nome: nome do cookie;valor: valor armazenado no cookie;exp: data de expiração do cookie (opcional), no formato Unix. Se não for definida, o cookie seráde sessão;path: path do script que gravou o cookie;dominio: domínio responsável pelo cookie;secure: se tiver valor 1, indica que o cookie só pode ser transmitido por uma conexão segura(https).Observações:Um cookie não pode ser recuperado na mesma página que o gravou, a menos que esta sejarecarregada pelo browser.Múltiplas chamadas à função setcookie serão executadas em ordem inversa;Cookies só podem ser gravados antes do envio de qualquer informação para o cliente. Portantotodas as chamadas à função setcookie devem ser feitas antes do envio de qualquer header outexto.Lendo cookies gravadosOs cookies lidos por um script PHP ficam armazenados em duas variáveis. no array$HTTP_COOKIE_VARS[], tendo como índice a string do nome do cookie, e numa variável cujonome é o mesmo do cookie, precedido pelo símbolo $.Exemplo:APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 98 -
    • Um cookie que foi gravado numa página anterior pelo seguinte comando:setcookie("teste", "meu cookie");Pode ser lida pela variável$HTTP_COOKIE_VARS["teste"]ou pela variável$teste 14. Manipulando arquivosAtravés do PHP é possível ter acesso aos arquivos do sistema, e até arquivos remotos. A seguirveremos alguns dos comandos utilizados para manipular arquivos no PHP.Copiando ArquivosPara fazer uma cópia de arquivo utilizando PHP basta utilizar a função copy, desde que o usuáriotenha as permissões necessárias para isso. A assinatura da função copy é a seguinte:int copy(string origem string destino);Lembrando que as strings contendo origem e destino devem conter os caminhos completos.Retorna false caso a cópia não seja realizada.Verificando o tamanho de um arquivoA função filesize pode ser bastante útil na criação de um script que liste o conteúdo de umdiretório, mas também é utilizada em casos como a função fread, que será vista mais adiante.int filesize(string arquivo);Esta função retorna um inteiro com o tamanho do arquivo, em bytes, ou false em caso de erro.Verificando se um arquivo existePara evitar erros em tratamento de arquivos, em certos casos é aconselhável verificar sedeterminado arquivo existe. para isso deve ser utilizada a função file_exists:int file_exists(string arquivo);Esta função tem um comportamento booleano: retorna apenas true ou false, não informando maisnada sobre o arquivo.Limpando o cachePor terem execução lenta, algumas funções que verificam o estado de arquivos utilizam umcache, ou seja, chamadas sucessivas da mesma função com relação ao mesmo arquivo nãoverificam se houve mudança no mesmo, retornando sempre o mesmo valor. Para eliminar essecache, obrigando o PHP a reavaliar o valor de retorno de uma função, deve ser utilizada aseguinte função:void clearstatcache();A palavra "void" indica que a função não retorna valor algum.As funções filesize e file_exists utilizam cache.Abrindo arquivos para leitura e/ou escritaPara ler ou escrever num arquivo é preciso antes de qualquer coisa abri-lo. Para isso deve serutilizada a função fopen, como visto a seguir:int fopen(string arquivo, string modo, int [use_include_path]);APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 99 -
    • A função fopen retorna false em caso de erro, e um identificador do arquivo em caso de sucesso.Esse identificador será utilizado em outras funções que manipulam o conteúdo do arquivo. Oprimeiro argumento é uma string contendo o nome do arquivo; o segundo, o modo como oarquivo será aberto, que pode ser um dos seguintes: r Abre o arquivo com permissão apenas para leitura. r+ Abre o arquivo com permissão para escrita e leitura, posicionando o ponteiro no início do mesmo. w Abre o arquivo com permissão apenas para escrita. Se o arquivo existir, todo o conteúdo é apagado. Se não existir, o PHP tenta criá-lo. O ponteiro é posicionado no início do arquivo w+ Abre o arquivo com permissão para escrita e leitura. Se o arquivo existir, todo o conteúdo é apagado. Se não existir, o PHP tenta criá-lo. O ponteiro é posicionado no início do arquivo a Abre o arquivo com permissão apenas para escrita. Se o arquivo não existir, o PHP tenta criá-lo. O ponteiro é posicionado no final do arquivo a+ Abre o arquivo com permissão para escrita e leitura. Se o arquivo não existir, o PHP tenta criá-lo. O ponteiro é posicionado no final do arquivo.O ponteiro citado na tabela dos modos de abrir um arquivo refere-se à posição a partir de onde osdados serão lidos e/ou gravados. Para alterar a posição desse ponteiro, pode-se utilizar a funçãofseek:int fseek(int fp, int posição);Onde fp é um identificador de arquivo, retornado da função fopen.O terceiro parâmetro da função fopen, que pode ter valor "0" ou "1" indica se o include_pathdeverá ser utilizado para localizar o arquivo. O include_path é um parâmetro determinado nophp.ini que indica exatamente em quais diretórios determinados arquivos serão procurados.Além de abrir arquivos localmente, utilizando o sistema de arquivos, a função fopen tambémpermite abrir arquivos remotos, utilizando os protocolos http ou ftp, da seguinte maneira:Se a string como o nome do arquivo iniciar por "http://" (maiúsculas e minúsculas são iguais),uma conexão é aberta com o servidor e o arquivo contendo o texto de retorno será aberto.ATENÇÃO: qualquer alteração feita no arquivo afetará apenas o arquivo temporário local. Ooriginal será mantido.Se a string como o nome do arquivo iniciar por "ftp://" (maiúsculas e minúsculas são iguais),uma conexão é aberta com o servidor e o arquivo será aberto. utilizando ftp o arquivo poderá seraberto para leitura ou escrita, mas não simultaneamente.Para encerrar a manipulação de um arquivo deve-se utilizar a função fclose, que tem o seguinteformato:int fclose(int fp);Onde fp é o identificador do arquivo, retornado pela função fopen.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 100 -
    • Lendo de um arquivostring fread(int fp, int tamanho);Esta função retorna uma string com o conteúdo do arquivo. O segundo parâmetro determina atéonde o arquivo será lido. Se o tamanho determinado for maior que o arquivo, não ocorre erro,tendo como retorno apenas o arquivo. Na maioria dos casos a função filesize é bastante útil,como no exemplo abaixo:$meuarquivo = "c:/autoexec.bat";$id = fopen($meuarquivo, "r");$conteudo = fread($id,filesize($meuarquivo));A função fread é "binary-safe", ou seja, pode ser usada para ler o conteúdo de um arquivobinário. Obviamente nesse caso é preciso saber exatamente onde utilizar o valor lido, para nãoobter resultados indesejados.Escrevendo em um arquivoint fwrite(int fp, string conteudo, int [tamanho]);Esta função grava num arquivo o conteúdo do segundo parâmetro. Se o tamanho é fornecido efor menor que o tamanho da string, será feita a gravação apenas de uma parte da mesma,determinada pelo terceiro parâmetro.ExemploPara demonstrar a leitura de um arquivo, utilizaremos um exemplo que necessita apenas de umaimagem do tipo GIF, que deve estar no mesmo diretório que nosso script de exemplo.<?$arquivo = "teste.gif"; /* este nome deve ser alterado para o nome do arquivo a ser utilizado*/$id = fopen($arquivo, "r"); /* abre o arquivo para leitura */$conteudo = fread($id,filesize($arquivo)); /* le o conteudo do arquivo e grava na variavel$conteudo */fclose($id); /* fecha o arquivo */header("Content-type: image/gif"); /* esta linha envia um header ao browser informando queo tipo de arquivo que está sendo enviado é uma imagem no formato gif */echo $conteudo; /* esta última linha envia ao browser o conteúdo do arquivo */?>Para que o exemplo funcione corretamente é preciso que o script seja apenas o que está listado,não podendo haver texto algum (nem mesmo espaço ou linha em branco) antes e depois doscript. Visualisando o script pelo browser, teremos a imagem selecionada.Uploads com formulários HTMLVimos no capítulo 03 que os formulários HTML têm um tipo de componente utilizado emupload de arquivos. Vimos também que todos os elementos de formulários quando submetidos ascripts PHP criam variáveis com os mesmos nomes. mas no caso do elemento "file", otratamento é diferente. Ao ser submetido o formulário, o arquivo uploadeado é gravado numarquivo temporário do disco, que será apagado ao final da execução do script. Além disso, quatrovariáveis são criadas no contexto do script PHP.$meuarquivo nome do arquivo temporario criado;APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 101 -
    • $meuarquivo_name nome original do arquivo selecionado pelo usuário;$meuarquivo_size tamanho do arquivo enviado;$meuarquivo_type tipo do arquivo, se esta informação for fornecida pelo browser;Neste exemplo, "meu arquivo" é o nome do elemento do formulário.Para armazenar o conteúdo de um arquivo numa tabela da base de dados ou até num arquivodefinitivo (neste segundo caso é mais simples utilizar a função copy) podemos utilizar o seguintescript, supondo que o campo do formulário tenha o nome "teste":<?$id = fopen($teste, "r"); /* abre o arquivo para leitura */$teste_conteudo = fread($id,filesize($teste)); /* le o conteudo do arquivo e grava na variavel$conteudo */fclose($id); /* fecha o arquivo */?>Com o exemplo acima, teremos o conteudo do arquivo enviado armazenado na string$teste_conteudo, podendo assim ser armazenado onde for mais adequado. 15. Enviando e-mailPara enviar e-mail através de um script PHP é bastante simples. Basta utilizar a função mail:mail(string to, string subject, string message, string [headers]);onde:to string contendo o e-mail do destinatário;subject assunto da mensagem;message o corpo da mensagem.headers outras informações de cabeçalho, como por exemplo "from", "reply-to", "bcc", etc.Para facilitar a compreensão dos scripts, os argumentos (como geralmente são strings grandes)devem ser atribuídos a variáveis antes da chamada da função mail.APOSTILA CURSO – INTRODUÇÃO HTML, JAVASCRIPT E PHP Pagina - 102 -