• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[Anfänger] Die Quelle der HTML Element Änderung finden!

xetra11

New member
Guten Morgen Zusammen,

Ich fange zZt. gerade mit JS in meiner Ausbildung an und habe natürlich schon eine frage im Bezug auf Debugging.

Auf einer Homepage gibt es Probleme mit dem Scrolling. Ein Element der section1 bleibt im css "position : fixed" bis zu einem bestimmten Punkt.
Dieser Punkt bzw. Pixel der Y-Achse ;) ist leider etwas spät. Jedoch ist der JS Code schon sehr weit fortgeschritten und ich habe Probleme damit die Quelle zu finden.

Dank dem Chrome Debugger konnte ich natürlich durch das coole highlighting sehen wann etwas geschehen ist. Und was verändert wurde.
Dementsprechend wurde mir für ein Element in der section1 gezeigt das sich das CSS position auf fixed bzw. auf relative ändert an einer bestimmten Stelle.

Ich möchte nun rausbekommen welche JavaScript Logik genau den Kram verursacht. Gibt da es irgendwelche Vorgehensweisen?

Ich wäre sehr dankbar für etwaige Hilfe!



gruß Charlie
 
Hi,

du hast schon den richtigen Ansatz. Mit dem Google Chrome Debugger kannst du durch die einzelnen Code Zeilen steppen (gehen) und dir so anschauen, was er wann und wie genau macht. Im Source Tab kannst du dazu in der entsprechenden JS Datei einen Brechpunkt (Breakpoint) setzen, indem du auf den Link Rand klickst. Anschließend kannst du mit den Pfeilen rechts oben durch die einzelnen Code Zeilen gehen. Mit dem blauen Play/Pause Zeichen kannst du die Ausführung ganz normal weiter laufen lassen.


Gruß
 
Hallo,

Ja das kenne ich soweit.

Jedoch ist es schwierig durch alle Code Zeilen zu steppen. Ich müsste direkt sehen wo die Logik der zugehörigen dynamisierung des HTML im JS Code liegt.
Wir haben halt arschviel Code (in meinen Augen) und dementsprechend wäre es sehr zeitaufwendig mich durch alle Zeilen durchzuklicken bis ich sehen das sich an der Stelle der HTML code verändert im Chrome Debugger/Elements Bereich.

Gibt es keinen direktere Referenz auf die ausführende Logik?
 
Im FF kann man sehen, welche Eventlistener bei einer Node registriert wurden. Da hier wahrscheinlich das scroll-Event des window-Objektes verwendet wird, kannst du dir ansehen, wo der Code liegt, wenn du dir die Events der <html>-Node ansiehst.
 
Zurück
Oben