javascript gestion des événements

Question

J'ai une requête. J'utilise 2 fonctions pour appeler une fonction sur un événement javascript.

1. tag HTML à l'intérieur comme:

   <div id='someid' onmouseover='callFunc()'>Some Text</div> 
   

2. tag extérieur comme dans la balise script/fichier externe:

   document.getElementById('someid').onmouseover=function(){ 
       alert('hi');  
   } 
   

Maintenant, je pense que les deux servent le même but, puis Y a-t-il une différence entre les deux façons? Quel est le meilleur? Quels sont les avantages et les inconvénients des deux? Deuxièmement, existe-t-il un autre moyen d'appeler cette fonction?

Answer 1

Les deux sont mauvais. Vous voulez addEventListener. Une bibliothèque comme jQuery fera autant plus facile, comme ceci:

$('#someid').mouseover(function() { alert('hi') }); 

La mise en ligne JavaScript HTML est jamais une bonne idée; il est difficile d'écrire (vous devez vous inquiéter de vous échapper) et difficile à maintenir.

L'attribution directe à on* est correcte, mais vous ne pouvez pas avoir plusieurs gestionnaires d'événements pour le même événement sur le même élément. Si un autre code essaye d'ajouter un gestionnaire plus tard, il effacera votre gestionnaire.

Answer 2

Il est beaucoup mieux mieux séparer votre code de votre code html.

Lorsque tout votre code est bien organisé dans une section ou mieux encore un fichier distinct, il est beaucoup plus facile de maintenir votre code.