Clientseitige Browser-Debugger: Wie kann ich die Liste der momentan auf einem Element registrierten Handler sehen?

Question

Lernen clientseitige Code einer bestehenden Website, würde gerne einige Aktivitäten, die vollständig auf der Client-Seite stattfindet verstehen.

Möchten Sie wissen, welche JS-Handler aufgerufen werden, wenn ich auf ein bestimmtes Element klicke. Gibt es eine Möglichkeit, diese Informationen in einer Art Debugger zu sehen?

ich Firefox mit Firebug bin mit oder Chrome

Answer 1

Die meisten Websites verwenden eine Art Javascript-Framework, das ein eigenes Event-Management-System verwendet, wodurch die DOM-Inspection-Tools von Firebug oder Chrome dev tool eher nutzlos werden.

Zum Glück ist es nicht zu schwer, sich in die Event-Systeme dieser Frameworks einzuklinken. Es gibt FireQuery, eine Erweiterung für Firebug, die sehr gut mit Firebugs DOM Inspector integriert ist, aber es funktioniert nur für jQuery. Für andere Frameworks gibt es auch Visual Event

Answer 2

können Sie die Chrome-Entwicklertools verwenden zu tun, was Sie suchen, wenn ich Ihre Frage richtig zu lesen (Entschuldigung, wenn ich nicht). Klicken Sie in Chrome mit der rechten Maustaste auf das Element auf der gerenderten Seite und wählen Sie "Element prüfen". Auf der rechten Seite des Tool-Fensters, das sich öffnet, befindet sich ein Abschnitt mit dem Namen "Properties", der eine Liste öffnet, wenn darauf geklickt wird. Das Untersuchen der Unterkategorien sollte Ihnen zeigen, welche Funktionen an welche Ereignisse angeschlossen sind. Sie können dann den Bereich "Skripte" (Registerkarte oben im Fenster "Entwicklungstools") verwenden, um Haltepunkte festzulegen und das Verhalten in Skriptdateien zu beobachten. Ich hoffe, das hilft.