Para utilizar comandos Jquery com maior eficiência e qualidade é importante entender alguns conceitos básicos de herança entre os elementos do DOM.

  • Filho: Descendente imediatamente posterior ao elemento.
  • Pai: Ancestral imediatamente anterior ao elemento.
  • Irmãos(siblings): Elementos que são filhos do mesmo pai.
  • Ancestral: Todos os elementos presentes anteriormente ao elemento em si.
  • Descendente: Todos os elementos presentes posteriormente ao elemento em si.

Por exemplo, observando o código da página abaixo:

herança dom

Com base nesse modelo podemos desenhar o seguinte diagrama:

organograma herança domAssim, observe que:

  1. ‘A’ é pai de ‘B’,  ‘C’ e ‘D’;
  2. ‘B’ é pai de ‘B1’, ‘B2’ e ‘B3’;
  3. C é pai de ‘C1’ e ‘C2’;
  4. D não tem filhos!
  5. ‘C12’ é filho de ‘C1’;
  6. Todos os elementos (com exceção de ‘A’), são descendentes de ‘A’;
  7. ‘B1’, ‘B2’ e ‘B3’ são descendentes de ‘B’, ou ‘B’ é ancentral de ‘B1’, ‘B2’ e ‘B3’;
  8. ‘B’ NÃO é ancentral de ‘C12’

E assim por diante!

// Comente!

comentários