2010-05-17 6 views

Répondre

9

Vous ne pouvez avoir qu'un seul gestionnaire avec on*.

Mais aucune limite sur le nombre de gestionnaires que vous pouvez attacher au même élément pour le même événement lorsque vous utilisez le modèle d'enregistrement d'événement. En outre, il aide à consolider tous les comportements au sein de Javascript et ne pas saupoudré dans le code de base. Remarque: vous pouvez également associer des événements en utilisant * dans votre Javascript. Le modèle d'enregistrement d'événement DOM a été introduit pour résoudre ce problème. Voir cet exemple pour plus d'informations:

// HTML 
<p id="somePara" onclick="alert('First')">...</p> 

// Javascript 
var el = document.getElementById("somePara"); 

el.onclick = function() { 
    alert("Second"); 
}; 

el.onclick = function() { 
    alert("Third"); 
}; 

// when <p> is clicked, it alerts "Third", overwriting the first two handlers. 

Au lieu de cela, une meilleure approche consiste à utiliser l'enregistrement d'événement. En reprenant l'exemple ci-dessus (ce qui est juste pour la démonstration et ce n'est pas cross-browser),

el.addEventListener("click", function() { 
    alert("Un"); 
}); 


el.addEventListener("click", function() { 
    alert("Dos"); 
}); 

// clicking on the <p> will now alert "Third", "Un", and "Dos". 
+0

Pensez-vous qu'il existe un cas où le modèle sur * est bon/doit/doit être utilisé/préféré au modèle d'écoute? –

+0

Si vous écrivez des sites très simples avec très peu de pages, et avez besoin de le faire rapidement, alors pourquoi pas. – Anurag

3

Il sépare votre code de votre contenu et le balisage. Le nettoyeur que la séparation est, le facile à maintenir, surtout lorsque votre équipe est supérieure à 1.

2

En outre, il contribue à la séparation des préoccupations. HTML est la structure de votre page, mais Javascript est le "comportement". Séparer la structure du comportement permet plus de réutilisation de code et de facilité de maintenance. (C'est aussi pourquoi la présentation [css] est séparée de la structure)

1

Il favorise une séparation nette entre le design (HTML, CSS) et l'action (javascript). Pour la même raison que son meilleur pour garder le code côté serveur séparé du code d'affichage.

Questions connexes