Les événements de JS bouillonnent par défaut et sont propagés de couche par couche. Vous pouvez arrêter la propagation des événements dans le niveau DOM via la fonction stoppropagation (). Comme dans l'exemple suivant:
Code html:
<! Doctype html> <html> <éadf> <meta charset = "utf-8" /> <taptin> stopPropagation () - Utilisé par Qiongtai Blog </Title> </ head> <body> </ Button> Button </ Button> </ Body> </html> [/ Code] Non stopPropagation () [Code] Var Button = Button = Document.getElementsByTagName ('Button') [0]; Button.OnClick = fonction (événement) {alert ('Button click');}; document.body.onclick = function (événement) {alert ('corps click');}Le DOM propage la couche par le calque, donc en cliquant sur le bouton se propage également au calque corporel, de sorte que le clic de la couche corporelle répond également. En conséquence, deux boîtes d'avertissement apparaissent, à savoir le bouton et le corps.
Ajout de stoppropagation ()
var bouton = document.getElementsByTagName ('Button') [0]; Button.OnClick = fonction (événement) {alert ('bouton cliquer'); // Arrêtez l'événement de propagation de la hiérarchie de l'événement Dom.stoppropagation ();}; document.body.onclick = function (événement) {alert ('corps click');}La fonction stopPropagation () est utilisée dans la fonction de gestion des événements de clic du bouton pour arrêter la fonction de propagation de l'événement, donc après la mise en garde de l'événement de clic du bouton, le corps ne peut pas être propagé et la boîte d'avertissement du corps ne se reproduira pas. En conséquence, la boîte d'avertissement n'est discutée qu'une seule fois.
Lors de l'écriture de JS, de nombreuses chaussures pour enfants ignorent souvent les caractéristiques des événements DOM réparant la couche par couche, ce qui entraîne des anomalies dans le programme. Si vous avez besoin de savoir plus de connaissances approfondies, vous pouvez trouver des informations sur la bouillonnement des événements JS.