Dhtm

Disponível somente no TrabalhosFeitos
  • Páginas : 12 (2909 palavras )
  • Download(s) : 0
  • Publicado : 6 de abril de 2011
Ler documento completo
Amostra do texto
Apostila retirada de http://www.ibestmasters.com.br

DHTML - Módulo 1: Visão geral e introdução
Por Marcelo Camargo

Visão geral

A tecnologia DHTML (Dynamic HTML) foi apresentada inicialmente como um conjunto de inovações ao Internet Explorer 4.0. DHTML disponibiliza para o criador de uma página web a habilidade de criar documentos que interagem com o usuário, sem a necessidade de umprocessamento do lado do servidor. A tecnologia DHTML nos disponibiliza, entre outras coisas: Animação: através da movimentação de elementos em uma página.

Formatação e posicionamento: através da flexibilidade para formatar elementos HTML, como a alteração dinâmica de cor, tamanho, fonte, posicionamento e outras características. Interação: através de uma linguagem de programação, como o JavaScript,para gerar interação com o usuário.

Iremos através deste tutorial entender como essa tecnologia funciona e explorar as suas mais importantes facetas.

Primeiramente iremos entender o que é DHTML, através de uma introdução a essa tecnologia. Essa introdução é importante para dividir nosso estudo em partes, de forma a explorar cada uma dessas partes em tempos diferentes. Neste módulo iremosresponder à pergunta "O que é DHTML?", além de conhecer as várias partes que compõe essa tecnologia.

O que é DHTML?
Muitos pensam que a tecnologia DHTML (Dinamic HTML) é uma linguagem. Errado. DHTML não é uma linguagem, mas sim um conjunto de tecnologias que juntas disponibilizam as ferramentas necessárias para tornar dinâmica a nossa conhecida linguagem HTML. Essas tecnologias são:

-HTML (Hyper Text Markup Language): A conhecida linguagem baseada em tags para a construção de páginas web estáticas.
- CSS (Cascading Style Sheets): Conhecida como folhas de estilo, essa tecnologia permite controlar a formatação dos diversos elementos que compõem uma página web.
- CSS Positioning: Permite a alteração do posicionamento de um elemento da página como textos e imagensdinamicamente, através de uma linguagem client scripting.
- Client scripting: Trata-se de um pequeno programa, que será interpretado pelo browser do cliente e não no servidor. Algumas linguagens de scripting que podem ser utilizadas são JavaScript e VBScript.
- DOM (Document Object Model): Trata-se do modelo de objetos (com suas propriedades e métodos) que são expostos ao programadorDHTML. Através do envio de mensagens a estes objetos, o programador pode explorar a interatividade com o usuário.

Mas, qual o papel de cada uma dessas tecnologias? Bem, vamos analisar um exemplo simples para entendermos melhor. Mais adiante, nestes tutoriais, iremos entrar em mais detalhes sobre a integração entre essas tecnologias.

Suponha uma página que movimente, de um lado a outrohorizontalmente, o texto "Olá Mundo DHTML!", alterando de tempos em tempos sua formatação (cor e tamanho). Para fazer isso, primeiramente precisamos da linguagem HTML para montar a página. Para a formatação do texto, utilizamos CSS que nos possibilita a alteração da cor e do tamanho da fonte. Mas, e para fazer o movimento do texto? Bem, aqui é que entra a parte mais interessante de DHTML, o DOM. Atravésdo DOM poderemos acessar o objeto que controla o texto e alterar as suas propriedades de posicionamento (CSS Positioning). Então podemos mudar as coordenadas X e Y do posicionamento, e com isso movimentar o texto. E como acessamos os objetos do DOM? Isso será possível através da utilização de uma linguagem de scripting como JavaScript ou VBScript.

Características de DHTML
Antes deprosseguirmos, iremos conhecer algumas características da tecnologia DHTML, para não sermos pegos de surpresa no futuro.

- Performance: Qual a performance que pode ser obtida com DHTML? Como vimos, o processamento é realizado localmente, ou seja, no browser do usuário, o que garante boa performance já que não exige o tráfego de informações pela rede durante a interação.

- Compatibilidade: O...
tracking img