Mutation events

Esta tradução está incompleta. Por favor, ajude a traduzir este artigo.

Deprecated
This feature has been removed from the Web standards. Though some browsers may still support it, it is in the process of being dropped. Do not use it in old or new projects. Pages or Web apps using it may break at any time.

Mutation events fornecem um mecanismo, para uma página web ou uma extensão, de notificação sobre as alterações feitas no DOM. Utilize ao invés, se possível, Mutation Observers.

Prefácio

Os eventos de mutação foram marcados como em desuso na DOM Events specification pelo fato do projeto da API ser falho (veja detalhes no "DOM Mutation Events Replacement: The Story So Far / Existing Points of Consensus" publicado em public-webapps).

Mutation Observers são a proposta de substituição para eventos de mutação no DOM4. Eles devem ser incluídos no Firefox 14 e Chrome 18.

As razões práticas para evitar os eventos de mutação são problemas de desempenho e suporte cross-browser.

Performance

Adicionando listeners de mutação do DOM a um documento degrada o desempenho profundamente de outras modificações DOM para esse documento (tornando-os 1.5 - 7 vezes mais lento!). Além disso, remover os listeners não reverte o dano.

O efeito de desempenho é limitado aos documentos que têm os listeners de evento de mutação.

Suporte cross-browser

Esses eventos não são implementados de forma consistente entre os diferentes navegadores, por exemplo:

  • IE anteriores à versão 9 não suportavam os eventos de mutação por completo e em alguns aspectos não implementa corretamente na versão 9 (por exemplo, DOMNodeInserted)
  • WebKit não suporta DOMAttrModified (veja webkit bug 8191 e the workaround)
  • "mutation name events", por exemplo DOMElementNameChanged e DOMAttributeNameChanged não são suportados no Firefox (a partir da versão 11), e provavelmente em outros navagedores também.
  • ...

Dottoro suporte a eventos de mutação nos navegadores.

Lista de mutation events

Listado a seguir todos os eventos de mutação, como definido no DOM Level 3 Events specification:

  • DOMAttrModified
  • DOMAttributeNameChanged
  • DOMCharacterDataModified
  • DOMElementNameChanged
  • DOMNodeInserted
  • DOMNodeInsertedIntoDocument
  • DOMNodeRemoved
  • DOMNodeRemovedFromDocument
  • DOMSubtreeModified

Uso

Você pode registrar um listener para eventos de mutação usando element.addEventListener, como mostrado a seguir:

element.addEventListener("DOMNodeInserted", function (event) {
  // ...
}, false);

O objeto event é transmitido para o listener em um MutationEvent (veja sua definição na especificação) para a maioria dos eventos, e MutationNameEvent para DOMAttributeNameChanged e DOMElementNameChanged.

Etiquetas do documento e colaboradores

 Colaboradores desta página: diegolw
 Última atualização por: diegolw,