é uma API independente de linguagem que representa como as marcações em HTML e XML são organizadas; Disposto em forma de árvore; Nos navegadores a API é JavaScript; Manipular o layout HTML é manipular o DOM;
que se "vê" (o layout em si); O DOM é a base para uma outra árvore que é o que realmente um browser monta na tela, a Árvore de Renderização (Render Tree); Render Tree possui também objetos que não possuem nós na árvore DOM, como scripts e folhas de estilos.
DOM tenha uma propriedade "display:none", este elemento e seus nós filhos não serão criados na Render Tree. Ao contrário do uso de "visibility:hidden"; O DOM tem um comportamento ligeiramente diferente com páginas HTML5;
o browser não reconhece um elemento, ele posiciona o elemento desconhecido como um nó filho de <BODY>. Por isso devemos usar modernizr ou HTML5shiv, para que o browser reconheça elementos HTML5 e monte a árvore DOM corretamente.
mudanças na disposição dos elementos de uma página, modificando a maneira como ela vai ser renderizada na página. Esse processo toma tempo para o cálculo e reposicionamento dos elementos.
o DOM; • Esconder nós com display: none; • Mover ou animar o DOM na página; • Adicionar CSS que mude o comportamento dos elementos; • Redimensionar janelas; • Alterar tamanho de fontes;
mudanças na apresentação dos elementos de uma página sem alterar a disposição do elementos. Ao contrário do Reflow, o Repaint não modifica a posição dos elementos na página.
pois causa Reflows e/ou Repaints, mas principalmente pelo DOM ser uma API independente; Temos uma ponte para atravessar com um pedágio aonde o preço é dado em desempenho; DOM --------------------- JavaScript
variáveis; • Variáveis locais são acessadas mais rápidamente; • Evite a instrução "with"; • Evite o uso de loops "for-in", a menos que necessário; • Evite ao máximo o uso de "eval"; • Use "[]" e "{}" ao invés de "new Array()" e "new Object()"; • Sempre minifique o script que irá para a produção;
módulos ajax, css, effects, etc...; Sizzle reestruturado: motor de seletores mais rápidos; Atualizaram e limparam o código de animações da biblioteca; Prefixos CSS, como -webkit, -moz e -ms são adicionados automaticamente; IE 6,7 e 8 continuam a ser suportados, teve mais de 160 correções de bugs; O tamanho total da nova versão diminuiu algumas centenas de bytes; REMOVIDO $(element).closest(Array) retornando Array (Usado para o ".live()") $.curCSS : Era um alias para jQuery.css() $.attrFn : Utilizada para definir quais os métodos podem ser usados em conjunção com $(html, props)
ul li') $('.data td.gonzalez') ao invés de $('div.data .gonzalez') $('.data td.teste') ao invés de $('.data table.blabla td.teste') $('.buttons').children() ao invés de $('.buttons > *') $('.gender input:radio') ao invés de $('.gender :radio') .on() ao invés de .live() .bind() .delegate() .on('click',function(){}) ao invés de .click(function(){}) .trigger('click') ao invés de .click() $.GET deve ser usado para operações não-destrutivas $.POST deve ser usado para operações destrutivas
framework jQuery que fornece funcionalidades de interface com o usuário, como animações, efeitos, temas, etc. Algumas funcionalidades: Widgets - accordion, datepicker, dialog, progress bar, slider, tabs; Interações - draggable, droppable, resizable, sortable, selectable;
jQuery UI voltado para Smartphones e Tablets (otimizado para eventos de toque). Suporte a temas e vários widgets comuns em interfaces de dispositivos móveis.
bolzan
utaani
fufuhu
bk_18
doyaaaaaken
enk
logilabo
cdataj
nearmugi
jisungbin
shinpeim
azuki
veronikapj
mthomps
erikaheidi
stephaniewalter
aarron
andyhume
jennybc
sachag
robhawkes
jrom
samanthasiow
paulrobertlloyd
reverentgeek
