Este artigo analisa a tecnologia de delegação de eventos JavaScript em um exemplo. Compartilhe para sua referência. A análise específica é a seguinte:
Se houver um grande número de botões em uma página geral, precisamos vincular manipuladores de eventos para cada botão. Isso afetará o desempenho.
Primeiro de tudo, cada função é um objeto e o objeto ocupará muita memória. Quanto mais objetos existem na memória, pior o desempenho.
Em segundo lugar, o aumento do número de visitas ao DOM fará com que a página seja carregada atrasada. De fato, ainda existem boas soluções para como fazer bom uso de manipuladores de eventos.
Delegação de eventos:
A solução para o problema de muitos manipuladores de eventos é a tecnologia de delegação de eventos.
A tecnologia delegada de eventos aproveita as bolhas de eventos. Basta especificar um manipulador de eventos.
Podemos vincular manipuladores de eventos para um elemento pai que precisa acionar um evento.
<ul id = "myList"> <li id = "li_1"> sdsdsd </li> <li id = "li_2"> sdsdsd </li> <li id = "li_3"> sdsdsd </li> </ul>
Agora queremos vincular manipuladores de eventos para esses 3 lis ...
Basta amarrar o manipulador de eventos na UL.
obj.eventHandler ($ ("mylist"), "clique", function (e) {e = e || window.event; switch (e.target.id) {// Todos ainda devem se lembrar de que o alvo é o destino do evento, // Li_1 "; alerta ("li_2");Se em um aplicativo da Web complexo, esse tipo de delegação de eventos é muito prático.
Se esse método não for adotado, a ligação a um por um será inúmeros manipuladores de eventos.
Espero que este artigo seja útil para a programação JavaScript de todos.