PROGRAMAÇÃO PARA INTERNET RICA Aula 6 - DHTML

Conteúdo Programático desta aula O DHTML ontem e hoje; As partes que fazem um todo poderoso; Andando por dentro das páginas; Formatando as páginas dinamicamente; Animando um pouco; Falando sobre as dificuldades.

O DHTML ontem e hoje O grande uso do DHTML no passado ficou por conta dos efeitos. Hoje ele vem aumentar as possibilidades da interface, trazendo funcionalidades que só eram encontradas em sistemas desktop. http://www.fromdesigner.com

As partes que fazem um todo poderoso O DOM define a estrutura da página XHTML CSS e o poder da formatação Javascript, não só o Javascript XHTML é base para os outros

Andando por dentro das páginas O Javascript possui métodos para andar pela estrutura do objeto do documento XHTML.

Código para andar pela estrutura

Recuperando o valor de um campo de formulário

Recuperando o valor de um campo do tipo radio

Manuseando elementos em uma página A interação poderá gerar a necessidade de que o código acrescente marcações na estrutura do documento ou altere alguma informação.

Manuseando um pouco

Mexendo com o Dom hasAttribute("atributo") - Verfica se o elemento possui o atributo. setAttribute("atributo","valor") - Atribui um valor ao atributo. getAttribute("atributo") - Obtém o valor do atributo. removeAttribute("atributo") - Remove o atributo. appendChild(objeto) - Adiciona um elemento como filho do atual. createElement("elemento") - Cria um elemento. createTextNode("conteúdo") - Cria um texto para por em um elemento

Mexendo com o Dom parentNode - Retorna o elemento pai do nó (elemento) atual. childNodes - Retorna a coleção de filhos do elemento. firstChild - Retorna o primeiro nó interno ao elemento. lastChild - Retorna o último nó interno ao elemento. nextSibling - Retorna o próximo nó filho do mesmo pai que o nó atual.

Formatando as páginas dinamicamente Controlando o CSS com o Javascript.

Configurando o CSS

Iniciando com Animação

Lembrando Usamos o CSS para gerar os efeitos dinâmicos no XHTML, por isso que muito que será programado terá início no propriedade "style" do objeto recuperado com getElementById. A propriedade "style" também é um objeto que possui propriedades, usamos: top, left visibility position

Mais um menu

Problemas que podemos encontrar Navegador Internet Explorer Firefox Outros Portátil

jQuery Algumas vantagens: