Debugging

debugging.html

About Debugging

Something very helpful when working with HTML and JavaScript are the inspection and debugging capabilities of your browser. Those differ from browser to browser, but the most popular ones all have the same basic tools to aid you.

Elements

Every browser offers the opportunity to look at all the elements on the page. This is helpful as it allows you to see if elements have been successfully created and what attributes they have. If you cannot see an element that should be there, it might be that it has been created, but some attributes area not defined or set to values that make the object not appear on the screen.

Firefox: You can find the Inspector on Extras -> Web-Developer -> Inspector

Chrome: You can find the Elements on Anzeigen -> Entwickler -> Elemente untersuchen

Safari: First you have to activate the Developer-Tools: Einstellungen -> Erweitert -> "Menü "Entwickler" in der Menüleiste anzeigen"
Then you can find the Elements on Entwickler -> Elementauswahl anzeigen

Console

The Console displays you error messages and warnings that might occur in your JavaScript part. It should be found in the same menu as the elements viewer.