É a idéia de tornar a página dinâmica seria a possibilidade de transformar ou mudar estrutura da página sem o reload dela, mudar um título, cabeçalho, cor, esconder algo do usuário ou mostrar num passe de mágica, sem que ele espere pelo reload da página inteira novamente.

Mas o que tem a ver DOM e Javascript com tudo isso ? DOM significa Document Object Model (Modelo de Objetos de Documento) que seria a estrutura HTML. É basicamente uma arvóre de nós.

Exemplo:

No exemplo acima temos dentro da div XIS os seguintes nós XIS>Y>H . Dizendo como é nossa estrutura. A idéia do DHTML é de que com o JavaScript utilizando padronização (CSS, xHTML / HTML) podemos fazer mudanças nesta estrutura em tempo real para facilitar a vida do usuário, seja deixando um texto mais escuro, mudando uma img, abrindo e fechando caixas ou até mesmo com recursos mais avançados como o AJAX.

Abraços e boa semana ; )

Um fator muito importante desconsiderado por muitos programadores, coders, e outros loucos, é a idéia que o visual SIM conta muito na hora que o usuário começa a mecher no sistema / site. Esse é um problema que vimos por ai na web, muitas vezes você programador se depara com um problema e a solução é um sistema, deixando aquela idéia de SITE de lado e sim começar a usar a idéia de montar um sistema, software como solução para um problema.

Porém este software na concepção do usuário tem aquela janela, cara de Janelas (Windows) por isso é importante que o sistema esteja condizente a esta idéia, não adianta criar um site, com rollover de imagens, isto não basta pois assim você ainda irá entregar ao cliente um site e não um sistema.

Para esta idéia o programador em php deve-se integrar-se cada vez mais com o JavaScript (sugestão), seja usando um Framework ou não; é uma linguagem que pode-se ser usada muito bem visualmente, ainda mais quando pensamos em frameworks, existem muitos no mercado que possa ajudar a você transformar tudo isso em uma idéia de que o Front-End é um sistema e não uma página, deixo então a dica do uso do Ext JS, um Framework para essa idéia de que o usuário possa usar e abusar com aquilo que ele esta acustumado ao operar um sistema.

A idéia do tutorial seria uma lista de itens adicionado a um listbox, formando um carrinho de compras dos itens, para depois então enviarmos tudo de uma vez so através do POST do form, gerando uma array para o PHP, é um dos clássicos em programação. Como muita gente não sabe da possibilidade em html/php deixo um tutorial para se ter uma idéia de como utilizar esse recurso.
Sem mais delongas vamos ao código, primeiramente o form, claramente veremos que o nosso listbox na verdade é um selectbox com a tag de multiple (virando assim um listbox):

Agora podemos escrever o código do JQuery com DOM para facilitar nossa vida:

Muito legal né? Mas e para remover ? Bom, para remover eu recomendo dar uma procurada na net sobre um plugin para ListBox usando o JQuery, vocês não querem tudo na mão né? Dúvidas e sugestões é so comentar.

JSON que se lê djeissón, pode ser utilizado em diversas linguagens, como php, c/c++, javascript, Java, Delphi, Perl, Python, Ruby, ColdFusion e muitas outras.

Imaginamos que ao clicar no botão alterar dados de uma lista, queremos trazer os dados da requisição do HTTP (Ajax) para colocalos no formulario. Para isso devemos retornar um dado do Ajax (arquivo da requisição) em JSON.

Para se encapsular dados para o Json no PHP basta o seguinte:

Otimo, agora como devemos ler os dados do retorno no JavaScript? Essa é parte mais fácil, para converter dados do texto JSON para objetos (variavel do JS) basta usar a função eval();

Agora basta popular o formulário (inputs, text area e afins) com DOM HTML. Pronto você aprendeu como JSON trabalha, o que é e como utilizar, agora basta utilizar suas ideias em conjunto ao Ajax e construir maravilhas.

O que é ?

É um conjunto de caracteres que forma uma expressão para testar uma entrada ou saída de dados, ah? É quando você tem um conjunto de caracteres que criam uma regra, que testa se o dados casa com essa expressão. Otimo, mas você ja faz isso quando faz uma busca, porém a ER lhe da mais flexibilidade além de ser padrão ou quase para um monte de linguagens. Por exemplo para validar um CPF, podemos em vez de desmembrar e testar para ver se faz parte de uma máscara, podemos utilizar o Regex.

Como utilizar?

Para utilizar no JavaScript vamos a um caso clássico de validação o do CPF, no caso a expressão eu retirei do blog fechaTag, caso queira criar a sua própria ER veja o Guia.
Para validar o CPF faremos:

Basta agora testarmos a variável r, para testar se o dado casa com nossa expressão regular. Lembre-se se o dado 'casar' quer dizer que ele (o valor) é aquilo que esperamos dentro da expressão, digo o CPF é válido.

Pronto agora você aprendeu um pouco sobre como validar usando Expressão Regular em JavaScript. Dúvidas é só comentar.

A idéia basica de ter varias imagens seguindo o mouse porém so ativa-las (mostra-las) quando o mouse passar por cima de algum link, div, tabela, celula; enfim um objeto qualquer. No nosso caso a escolha foi uma DIV.

Primeiro vamos criar a div igual anteriormente, porém vamos agora, esconder essa div, para que não apareça na tela:

Segundo passo é criar os links, no nosso caso como dito anteriormente vamos criar os links apartir de uma div, apartir dessa div iremos chamar a Função javascript que irá mostrar a div referente, iremos usar 2 ações: onmouseover (Ação executada quando o mouse esta em cima do objeto) e onmouseout (Ação executada quando o mouse esta fora do objeto, melhor quando ele sai do objeto). Ao executar a ação iremos chamar a função enviando 2 parametros, ID (dizendo qual DIV) e AÇÃO (qual ação tomar Mostrar/Esconder).

No nosso caso ação  1 mostra a div e ação parametro 0 esconde a div.

Agora basta usarmos a função do POST anterior e complementar nela a idéia de mostra e esconder a div, ficando o script completo da maneira abaixo:

Para ver o exemplo em execução basta acessa o link : Idéia para Div seguindo o mouse. Sinta-se livre para comentar, duvidar, justificar e até se justificar. ah?