Detaillierte Erläuterung der Beispiele für die JS-Ereignisüberwachung

小云云
Freigeben: 2023-03-21 08:14:02
Original
1967 Leute haben es durchsucht

Definition der Ereignisüberwachung

In Javascript werden Browser im Allgemeinen in zwei Kategorien unterteilt:

① Browser basierend auf dem IE-Kernel (IE-Browser mit einer Versionsnummer unter 9)

② Browser basierend auf W3C-Kern (IE-Browser, Firefox, Google und andere Browser mit Versionsnummer größer als 9)

1) Grundlegende Syntax: Browser basierend auf IE-Kern

dom object.attachEvent(type, callback, capture): Binden Sie einen Ereignis-Listener an das Element

Parameterbeschreibung:

Typ: gebundener Ereignistyp, z. B. onclick, onmouseover, onmouseout

Rückruf: Event-Handler, normalerweise eine anonyme Funktion

Capture: Das verwendete Browsermodell, das Bubbling-Modell und das Capture-Modell. Standardmäßig unterstützen Browser unter IE8 nur das Bubbling-Modell.

?

1

1

2

3

4

5

6

7

8

9

10

11

12


//封装$函数,用于获取id的元素
function $(id){
    return document.getElementById(id)     
}
//绑定事件监听
$('btn').attachEvent('onclick',function(){
    alert('hello')
});
//二次绑定
$('btn').attachEvent('onclick',function(){
    alert('world')
});
Nach dem Login kopieren


2

3

4

5

6

< p class="Zeilennummer7 index6 alt2" style="margin:0px;padding:0px;">7

8

9

10

11

12

//封装$函数,用于获取id的元素
function $(id){
    return document.getElementById(id)     
}
//绑定事件监听
$(&#39;btn&#39;).addEventListener(&#39;onclick&#39;,function(){
    alert(&#39;hello&#39;)
});
//二次绑定
$(&#39;btn&#39;).addEventListener(&#39;onclick&#39;,function(){
    alert(&#39;world&#39;)
});
Nach dem Login kopieren

2.

1

2

3

4

5

6

7

8

9

10

11

12


Grundsätzliche Syntax: Ereignisüberwachung basierend auf dem W3C-Kernel dom object.addEventListener(type, callback): Ereignisüberwachung für den W3C-Kernel-Browser binden Parameterbeschreibung: Typ: Bindungsereignistyp, ohne „on“-Präfix, wie z. B. Klicken, Mouseover, MouseoutRückruf: Ereignishandler, normalerweise eine anonyme Funktion

12

3

4

5

6

7

8

9

10

11

12



Zusammenfassung der Unterschiede in der Ereignisüberwachung

Die Abhörmethode des IE-Kernels und die Abhörmethode des W3C-Kernels:

①Die Methoden sind unterschiedlich

Die Abhörmethode des IE-Kernels. Der Browser verwendet attachmentEvent zum Binden

W3C-Kernbrowser verwendet addEventListener zum Binden

②Die Parameter sind unterschiedlich

Der IE-Kernbrowser hat Drei Bindungsmethoden: Typ, Rückruf, Erfassung (verwendetes Browsermodell)

W3C-Kernel-Browser, seine Bindungsmethode hat insgesamt zwei Parameter, Typ und Rückruf

③Typparameter sind unterschiedlich

Bei IE-Kernbrowsern muss dem Typ nicht das Präfix „on“ vorangestellt werden, z. B. onclick

Bei W3C-Kernbrowsern muss dem Typ nicht das Präfix „on“ vorangestellt werden, z. B. click

④Die Auslösereihenfolge ist unterschiedlich

Bei IE-basierten Browsern erfolgt die Ereignisüberwachung zuerst nach der Bindung und dann wird die Bindung zuerst ausgelöst.

Bei W3C-basierten Browsern Die Ereignisüberwachung wird zuerst durchgeführt. Zuerst werden Auslöser gebunden, dann werden Auslöser gebunden.

Verwandte Empfehlungen:

Detaillierte Erläuterung der Anwendungsbeispiele für Ereignisüberwachung und Ereignisveröffentlichung in Node.js

Detaillierte Einführung in das JS-Tastenkombinations-Ereignisüberwachungs-Plug-in

Detaillierte Erläuterung der jQuery-Mobile-Ereignisüberwachung und -Nutzung

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Beispiele für die JS-Ereignisüberwachung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage