Verwandte Lesungen:
JavaScript -Ereignis -Lernzusammenfassung (v) Mausereignis Typ in JS
//www.vevb.com/article/86259.htm
JavaScript -Ereignislernzusammenfassung (i) Ereignisfluss
//www.vevb.com/article/86261.htm
JavaScript -Event -Lernzusammenfassung (iv) öffentliche Ereignismitglieder (Eigenschaften und Methoden)
//www.vevb.com/article/86262.htm
JavaScript -Ereignis -Lernzusammenfassung (ii) JS -Ereignishandler
//www.vevb.com/article/86264.htm
JavaScript Event Learning Summary (iii) JS -Ereignisobjekt
//www.vevb.com/article/86266.htm
1. Ereignisobjekt
1. Verstehen Sie das Ereignisobjekt
Ereignisse existieren im Browser als Objekte, d. H. Ereignis. Das Auslösen eines Ereignisses generiert ein Ereignisobjektereignis, das alle Informationen zum Ereignis enthält. Enthält die Elemente, die zu dem Ereignis, der Art des Ereignisses und anderen Informationen zu einem bestimmten Ereignis führen.
Zum Beispiel: Das vom Mausoperation generierte Ereignis enthält Informationen zur Mausposition. Das vom Tastaturvorgang generierte Ereignis enthält Informationen zur gedrückten Taste.
Alle Browser unterstützen Ereignisobjekte, die Unterstützungsmethoden sind jedoch unterschiedlich. In DOM müssen Ereignisobjekte als eindeutige Parameter an Ereignisbearbeitungsfunktionen übergeben werden. Im IE ist das Ereignis ein Attribut von Fensterobjekten.
2. Ereignis im HTML -Event -Handler
<input id = "btn" type = "button" value = "click" onclick = "console.log ('html Ereignishandler'+Ereignis.typ)"/>Dies erstellt eine Funktion, die das lokale variable Ereignis enthält. Auf das Ereignisobjekt kann direkt über das Ereignis zugegriffen werden.
3. Ereignisobjekte in DOM
Die Ereignishandler bei Level DOM0 und Level DOM2 übergeben das Ereignis als Parameter.
<body> <input id = "btn" type = "button" value = "klicken"/> <script> var btn = document.getElementById ("btn"); btn.onclick = function (Ereignis) {console.log ("dom0 & click"); console.log (Ereignis.type); //click}btn.addeventListener("click ", function (Ereignis) {console.log (" Dom2 & click "); console.log (Ereignis.Type); // click}, false) </script> </body>4. Ereignisobjekte in IE
Der erste Fall: Beim Hinzufügen eines Ereignishandlers über die DOM0 -Ebene -Methode existiert das Ereignisobjekt als Attribut des Fensterobjekts.
<body> <input id = "btn" type = "button" value = "klicken"/> <script> var btn = document.getElementById ("btn"); btn.onclick = function () {var event = window.event; console.log (event.type); // Klicken Sie auf} </script> </body>Der zweite Fall: Der Ereignishandler über AntegenEvent () fügte hinzu, und das Ereignisobjekt wird als Parameter übergeben.
<body><input id="btn" type="button" value="click"/><script>var btn=document.getElementById("btn");btn.attachEvent("onclick", function (type) {console.log(event.type); //click})</script></body>Aber ich verstehe zwei Dinge nicht.
1. Ein Ereignisparameter kann auch in den Ereignishandler über die DOM0 -Ebene -Methode übergeben werden. Sein Typ ist der gleiche wie window.event.type, aber der übergebene Ereignisparameter unterscheidet sich von window.event. Warum?
btn.onclick = function (Ereignis) {var event1 = window.event; console.log ('event1.Type ='+Event1.Type); //event1.type=clickconsole.log('event.type='+Event.type); //event.type=clickconsole.log('event1==event?'+(Event==event1)); // Event1 == Ereignis? Falsch}2. Das Ereignis, das im Ereignishandler über den Aattal Event übergeben wurde, unterscheidet sich von window.event. Warum?
<body> <input id = "btn" type = "button" value = "klicken"/> <script> var btn = document.getElementById ("btn"); btn.attachEvent ("Onclick", Funktion (Typ) {console.log (Event.Type); //clickconsole.log("Event===Window.event?"+(Event==Window.event));Das obige ist die Zusammenfassung von JavaScript Event Learning (III) verwandtes Wissen über JS -Ereignisobjekte, die vom Editor eingeführt wurden. Ich hoffe, es wird für alle hilfreich sein. Wenn Sie mehr wissen möchten, achten Sie bitte auf die Website wulin.com!