1. Modèle d'événement traditionnel
Il y a des limites dans les modèles d'événements traditionnels.
Le modèle en ligne est utilisé sous la forme d'attributs de balises HTML et est mélangé avec du HTML. Cette méthode provoque sans aucun doute des problèmes de modification et d'extension et est rarement utilisé.
Le modèle de script écrit des fonctions de traitement d'événements dans un fichier JS, obtient des éléments de la page pour lier les fonctions d'événement correspondantes pour déclencher l'exécution. Mais il y a aussi des lacunes:
1. Un événement lie plusieurs fonctions d'écoute d'événements, ce dernier l'emporte sur le premier.
2. La liaison répétée doit être restreinte
3. Standardiser les objets de l'événement
2. Liaison des événements modernes
Les événements de niveau DOM2 définissent deux méthodes pour ajouter et supprimer les événements: AdVEventListener () et RemoveEventListener (). Ils reçoivent trois paramètres: nom d'événement, fonction, bouillonnement ou valeur booléenne capturée (vrai signifie capture, faux signifie bouillonner).
En conséquence, IE fournit deux méthodes similaires attachée enceinte () et detachevent (), mais les deux méthodes d'IE ont d'autres problèmes: il est impossible de passer cet objet (ceci dans IE Points to Window) Vous pouvez utiliser la méthode d'appel pour usurper l'identité d'un objet:
fonction addEvent (obj, type, fn) {if (typeof obj.addeventListener! = 'undefined') {obj.addeventListener (type, fn, false); } else if (obj.attachevent! = 'undefined') {obj.attachevent ('on' + type, function () {fn.call (obj, window.event);}); }};Cependant, comme les fonctions anonymes sont exécutées lors de l'ajout, elles ne peuvent pas être supprimées après l'ajout; De plus, les méthodes IE fournies par IE auront également des problèmes tels que l'exécution infructueuse des événements de liaison dans les fuites de séquence et de mémoire.
Afin de résoudre cette série de problèmes, il est nécessaire de résumer davantage la méthode et d'utiliser la norme de niveau DOM2 pour d'autres navigateurs. Pour IE, l'ajout et la suppression en fonction du mode traditionnel sont adoptés. L'idée est:
1. L'ajout est d'utiliser la table de hachage de JS pour stocker les événements d'objets, d'attribuer une valeur d'ID à chaque événement d'objet et de déterminer d'abord si la même fonction de traitement existe dans l'ordre d'addition. S'il n'existe pas, ajoutez à son tour la fonction de liaison des événements à la table de hachage. Cela résout le problème de l'incapacité à exécuter en séquence et des ajouts répétés.
2. Lors de la suppression, il est utilisé pour juger de l'appariement de la fonction de traversée. S'il existe, il est supprimé.
Résumer:
Je n'avais pas beaucoup plus de compréhension de la liaison des événements JS auparavant, et je suis même resté dans le modèle de liaison des événements traditionnels, et j'avais toujours une compréhension trop superficielle de la mise en œuvre du programme. Cette fois, lorsque j'ai appris la bibliothèque d'encapsulation, j'ai appris beaucoup d'applications orientées objet sur JS. Bien que les bibliothèques JS comme JQuery aient obtenu un bon effet d'encapsulation des mécanismes de liaison des données, je ne connais que la raison, mais je ne sais pas pourquoi, et je pense que si j'ai le sentiment d'être gardé dans l'obscurité, j'analyserai moi-même la mise en œuvre spécifique et je ressentirai une illumination soudaine. Je me rends également compte que pour faire un bon travail d'un programme compatible et polyvalent, je dois considérer beaucoup de contenu et résoudre de nombreux problèmes, et je nettoie progressivement beaucoup de ces problèmes.