La délégation d’événements permet de ne pas surcharger la mémoire du navigateur en instanciant un seul écouteur pour plusieurs éléments du DOM.
Exemple :
L’élément du DOM dont l’ID est t est déclaré comme le délégué. Il intercèpte les événements de tous ses fils.
(…)
<style type="text/css">
#t { border: 1px solid red }
#t1 { background-color: pink; }
</style>
<script type="text/javascript">
function modifyText(new_text) {
var t2 = document.getElementById("t2");
t2.firstChild.nodeValue = new_text;
}
function load() {
var el = document.getElementById("t");
el.addEventListener("click", function() {
modifyText("four")}, false); }
</script>
</head>
<body onload="load();">
<table id="t">
<tr><td id="t1">one</td></tr>
<tr><td id="t2">two</td></tr>
</table>
(…)