Wie prüfen ob Javascript Code fehlerfrei ausgeführt wird?

[Horst]

Guten Tag,

wie kann man im Firefox prüfen, ob ein Javascript-Code ausgeführt wird und ob dies fehlerfrei passiert?

Kann man die Zeilen des Javascript Codes vielleicht sogar schrittweise ausführen lassen um dann zu prüfen welche Werte die Variablen nach jedem Schritt enthalten?

[Henry]

Hallo Horst,

wie kann man im Firefox prüfen, ob ein Javascript-Code ausgeführt wird und ob dies fehlerfrei passiert?

Eine Menge Entwicklertools findest du oben unter Extras. Da stehen auch die passenden Tastenkürzel.

Kann man die Zeilen des Javascript Codes vielleicht sogar schrittweise ausführen lassen um dann zu prüfen welche Werte die Variablen nach jedem Schritt enthalten?

Du kannst zwischendurch, so mache ich es auf die Schnelle, immer mal wieder ein alert mit der Variablen ausgeben. Bei größeren Sachen, schaffe ich mir eine eigene Entwicklungsumgebung, die größtenteils framebasierend ist und dort simultan Ereignisse und Ergebnisse anzeigt.

Gruss
Henry

[beatovich]

hallo

Du kannst zwischendurch, so mache ich es auf die Schnelle, immer mal wieder ein alert mit der Variablen ausgeben.

alert ist Scheisse(tm), wenn schon console.log

console.log(element) gibt das Element mit allen Attributen aus
console.log(event) gibt in Event mit allen Attributen aus

[Horst]

Warum ist alert nicht gut und wo kann ich console.log finden?

[beatovich]

hallo

Warum ist alert nicht gut und wo kann ich console.log finden?

console.log schreibt man als debugging-zeilen in den Code.

Beispiel

function myfunc(ev){
  console.log("in myFunk", ev); // Ausgabe wird in die Konsole geschrieben.
  // weiterer Code hier
}

[Horst]

Das mit console.log finde ich genauso umständlich wie mit alert, weil man den Quellcode verändern muss.

Kann man console.log auch zur Laufzeit einfügen also in den Entwicklertools, geht das?

Kann man das Javascript nicht einfach schrittweise in den Entwicklertools durchlaufen lassen und sich per Tooltipp oder ähnlich anzeigen lassen welchen Wert die Variablen gerade enthalten.

Und wo kann man eventuelle Javascript Fehler anzeigen lassen?

[Matthias Scharwies]

Servus!

Das mit console.log finde ich genauso umständlich wie mit alert, weil man den Quellcode verändern muss.

Kann man console.log auch zur Laufzeit einfügen also in den Entwicklertools, geht das?

Kann man das Javascript nicht einfach schrittweise in den Entwicklertools durchlaufen lassen und sich per Tooltipp oder ähnlich anzeigen lassen welchen Wert die Variablen gerade enthalten.

Ja, mit Haltepunkten (''breakpoints'').

Und wo kann man eventuelle Javascript Fehler anzeigen lassen?

In der Konsole.

Auch wenn das am Anfang umständlich erscheint. Langfristig ist das der bessere Weg. Herzliche Grüße

Matthias Scharwies

[Horst]

Ja, mit Haltepunkten (''breakpoints'').

Ich binde Javascript Code direkt ins html ein (nicht über eine externe Datei). Dann klicke ich in den Firefox Entwicklertools auf Debugger. Wo im Feld Quellen auf der linken Seite finde ich denn dann den Javascript-Code in dem ich dann den Breakpoint setzten kann?

[dedlfix]

Tach!

Ja, mit Haltepunkten (''breakpoints'').

Ich binde Javascript Code direkt ins html ein (nicht über eine externe Datei). Dann klicke ich in den Firefox Entwicklertools auf Debugger. Wo im Feld Quellen auf der linken Seite finde ich denn dann den Javascript-Code in dem ich dann den Breakpoint setzten kann?

Einer der Punkte auf der linken Seite ist deine HTML-Datei. In die kannst du auch im Javascript-Bereich (<script>...</script>) Breakpoints setzen.

dedlfix.

[Horst]

Einer der Punkte auf der linken Seite ist deine HTML-Datei. In die kannst du auch im Javascript-Bereich (<script>...</script>) Breakpoints setzen.

Die HTML-Datei habe ich gefunden. Den Javascript Code auch, Breakpoint klappt, danke.

Ich weiß, dass auch Javascript-Code über den Google Tag Manager eingebunden wird. Wie kann ich denn einen Breakpoint für einen Javascript Code setzen der über den Google Tag Manager eingebunden wird? Dazu müsste ich wissen wo ich den Javascript Code, der über den Google Tag Manger eingebunden wird suchen muss. Kannst du mir das sagen?

[dedlfix]

Tach!

Ich weiß, dass auch Javascript-Code über den Google Tag Manager eingebunden wird. Wie kann ich denn einen Breakpoint für einen Javascript Code setzen der über den Google Tag Manager eingebunden wird?

Im Prinzip auf gleiche Weise, aber der Code wird minifiziert sein und damit unleserlich und schlecht zu debuggen.

Dazu müsste ich wissen wo ich den Javascript Code, der über den Google Tag Manger eingebunden wird suchen muss. Kannst du mir das sagen?

Der wird auch auf der linken Seite zu finden sein. Auch die zur Laufzeit eingebundenen Scripts finden sich dort.

dedlfix.

[Rolf B]

Hallo dedlfix,

minifiziert

kommt drauf an, z.B. Chrome hat diesen { } Button, mit dem man ent-minifizieren kann.

Wenn's natürlich auch noch obfusciert (oder uglifiziert) wurde, dann wird es knifflig.

Rolf

[Horst]

kommt drauf an, z.B. Chrome hat diesen { } Button, mit dem man ent-minifizieren kann. Wenn's natürlich auch noch obfusciert (oder uglifiziert) wurde, dann wird es knifflig.

Ohje, ich habe keinen Plan was minifizieren,obfuscieren oder uglifizieren ist, ich finde da auch nirgends eine gute Erklärung. Hast du eine Quelle wo das erklärt wird?

Kann man nur mit Chorme ent-minifizieren oder geht das auch mit dem Firefox?

Ich finde im Chrome das {} nirgends. Kannst du mir anhand eines Beispiels erklären wie Code im Chrome ent-minifiziert wird?

[dedlfix]

Tach!

Ohje, ich habe keinen Plan was minifizieren,obfuscieren oder uglifizieren ist, ich finde da auch nirgends eine gute Erklärung.

Das sind größtenteils Synonyme für eingedampften Code. Um Downloadgröße zu sparen lässt man alles für die eigentliche Ausführung überflüssige aus dem Code raus, beispielsweise Whitespace, der nur der Lesbarkeit willen eingefügt ist und Kommentare. Auch Variablennamen kürzt man soweit es geht. Heraus kommt dann derselbe ausführbare Code, aber er ist nur noch maschinenlesbar. Der Zweck ist nicht, dass man ihn am Client debuggen kann. Üblicherweise gibts jedoch den Code in beiden Versionen, solange er Open Source ist. Ob das für den Google-Code zutrifft, weiß ich nicht.

Kann man nur mit Chorme ent-minifizieren oder geht das auch mit dem Firefox?

Geht.

Ich finde im Chrome das {} nirgends. Kannst du mir anhand eines Beispiels erklären wie Code im Chrome ent-minifiziert wird?

Unterhalb des Codes in der Fußzeile in Firefox und Chrome. Chrome hat außerdem noch eine Frage obendrüber eingeblendet (vielleicht aber auch nicht immer).

dedlfix.

[Horst]

Ich finde im Chrome das {} nirgends. Kannst du mir anhand eines Beispiels erklären wie Code im Chrome ent-minifiziert wird?

Unterhalb des Codes in der Fußzeile in Firefox und Chrome.

Unterhalb welcher Fußzeile, ich finde da nix?

Chrome hat außerdem noch eine Frage obendrüber eingeblendet (vielleicht aber auch nicht immer).

Was für ne Frage???

[dedlfix]

Tach!

Unterhalb des Codes in der Fußzeile in Firefox und Chrome.

Unterhalb welcher Fußzeile, ich finde da nix?

Chrome hat außerdem noch eine Frage obendrüber eingeblendet (vielleicht aber auch nicht immer).

Was für ne Frage???

Bei mir sieht das so aus:

In der Fußzeile das {} ist klickbar. Und wenn man auf die Frage oben klickt, dann wird da auch auf das Symbol unten verwiesen.

dedlfix.

[Horst]

In der Fußzeile das {} ist klickbar. Und wenn man auf die Frage oben klickt, dann wird da auch auf das Symbol unten verwiesen.

Im Chrome finde ich das {} im Firefox nicht. Wo ist das {} im Firefox?

[dedlfix]

Tach!

Im Chrome finde ich das {} im Firefox nicht. Wo ist das {} im Firefox?

Bei mir an derselben Stelle.

dedlfix.

[Rolf B]

Hallo Horst,

im Prinzip an genau der gleichen Stelle, am unteren Fensterrand der Entwicklerwerkzeuge. Du musst allerdings eine .js Datei offen haben.

Geguckt mit FF52-ESR und FF56.

Rolf

[Horst]

Habs gefunden, danke. Laut Ghostery verwendet Zalando den Google Tag Manager. Außerdem verwendet Zalando Google Analytics. Vermutlich wird Analytics bei Zalando über den Tag Manager integriert. Wie kann man den Analytics-Code, der über den Tag Manager integriert wird, mit Hilfe der Firefox Entwicklertools finden? Auf welche Datei in den Quellen im Debugger muss man klicken damit der Google Analytics Code angezeigt wird?

[JürgenB]

Hallo Horst,

… Google Tag Manager … Google Analytics …

nur mal so zwischendurch gefragt: hast du dich auch schon mit dem Thema „Datenschutz“ beschäftigt?

Gruß
Jürgen

[Auge]

Hallo

… Google Tag Manager … Google Analytics …

nur mal so zwischendurch gefragt: hast du dich auch schon mit dem Thema „Datenschutz“ beschäftigt?

Müsste in diesem Fall nicht Zalando der Adressat deiner Frage sein?

Tschö, Auge

[JürgenB]

Hallo Auge,

Müsste in diesem Fall nicht Zalando der Adressat deiner Frage sein?

nein. Horst bindet die Scripte und Bilder in seine Seite ein, nicht Zalando oder Google. Oder arbeitet Horst für Zalando?

Gruß
Jürgen

[Auge]

Hallo

Müsste in diesem Fall nicht Zalando der Adressat deiner Frage sein?

nein. Horst bindet die Scripte und Bilder in seine Seite ein, nicht Zalando oder Google. Oder arbeitet Horst für Zalando?

Aus seinem Posting, auf das du antwortetest.

Laut Ghostery verwendet Zalando den Google Tag Manager. Außerdem verwendet Zalando Google Analytics. Vermutlich wird Analytics bei Zalando über den Tag Manager integriert.

Das hat mich annehmen lassen, dass er hier die/eine Zalando-Seite untersucht.

Tschö, Auge

[JürgenB]

Hallo Auge,

ich dachte, Horst bindet irgendwelches Zeugs von Zalando ein, das dann Zeugs von Google einbindet.

Gruß
Jürgen

[Rolf B]

Hallo Horst,

Ich finde im Code-Navigator sowohl Googles Tag-Manager als auch Analytics. Vermutlich wird Analytics durch GTM aktiviert, ja, dazu ist GTM ja da. D.h. zuerst startet GTM und bindet dann je nach den Zalando-Einstellungen GA ein.

Code findet man im "Debugger" Tab der Firefox Entwicklerwerkzeuge. Und da mach einfach mal die Augen auf, es gibt einen Navigator. Code, der direkt auf der HTML Seite steht und nicht extern zugeladen wird, findest Du unter der Rubrik www.zalando.de, darin der Name der Seite (z.B. damen-home).

Ob überhaupt was schiefgeht, solltest Du erstmal in der Konsole überprüfen. Dort tauchen Fehlermeldungen bei der Codeausführung mit Angabe der Fehlerposition auf.

Breakpoints, die in Scripten greifen sollen die beim Laden der Seite laufen, sind so eine Sache. Du musst die Seite laden, die Breakpoints setzen und dann die Seite aktualisieren. Mit etwas Glück greifen sie dann - hängt davon ab ob die Seite 1:1 gleich ausgeliefert wird.

Aber so langsam wundere ich mich auch. Du willst bei Zalando gucken, ob da Google Analytics fehlerfrei ausgeführt wird? Und da Du Ghostery brauchst, um die Nutzung von GA zu erkennen, bist Du offenbar nicht bei Zalando. Was ist eigentlich das Problem, das Du lösen willst?

Rolf

[Rolf B]

Hallo Horst,

wenn das hier normaler Code ist:

if (steuerCode==17) {
   betriebsschalter=3;
   schreibeNachricht("hey");
}
else
{
   betriebsschalter=99;
}

dann wäre das hier sanft minifiziert:

steuerCode==17?betriebsschalter=3,schreibeNachricht("hey"):betriebsschalter=99;

Der if-Befehl wurde durch den ternären Operator ersetzt, und der Komma-Operator dient dazu den then-Block des if ohne geschweifte Klammern zusammenzufassen. Sowas funktioniert, wenn man GANZ genau weiß, wie die Vorrangregeln der Operatoren sind.

und das hier obfuscated oder uglifiziert (von obfuscate=verschleiern oder ugly=häßlich):

a==17?b=3,c("hey"):b=99;

Ein Obfuscator vergibt alle Namen neu, soweit sie nicht extern sichtbar sind, so dass man aus den Namen keine Rückschlüsse mehr auf den Sinn des Codes ziehen kann.

JS-Bibliotheken bekommen, wenn sie minifiziert angeboten werden, gerne ein .min in den Namen, also z.B. jQuery-3.1.1.min.js.

Rolf

[Matthias Apsel]

Hallo Rolf B,

magst du das in dieser Form auch ins Wiki schreiben? Z.B. glossar/Minifizierung?

Bis demnächst
Matthias

[Rolf B]

Hallo Matthias,

es gibt einen Minify-Redirekt; wie sortiert man das am besten?

Ich würde den Minify-Redirekt zu einem Glossar-Artikel ändern wollen, dort die Beispiele unterbringen und von dort auf den existierenden Artikel verweisen.

Oder lassen wir den Redirekt und ich schreib's ins Tutorial?

Rolf

[Matthias Apsel]

Hallo Rolf B,

Ich würde den Minify-Redirekt zu einem Glossar-Artikel ändern wollen, dort die Beispiele unterbringen und von dort auf den existierenden Artikel verweisen.

Das ist auch meine Intension.

Bis demnächst
Matthias

[Matthias Scharwies]

Servus!

Ja, mit Haltepunkten (''breakpoints'').

Ich binde Javascript Code direkt ins html ein (nicht über eine externe Datei). Dann klicke ich in den Firefox Entwicklertools auf Debugger. Wo im Feld Quellen auf der linken Seite finde ich denn dann den Javascript-Code in dem ich dann den Breakpoint setzten kann?

Unter Debugger klickst du auf deine Quelle (die HTML-Datei).

Durch einen Klick auf die Zeilenangabe kannst du einen (oder mehrere) Haltepunkte setzen und dann das script von Breakpoint zu Breakpoint ausführen.

Die MDN hat hier ein Tutorial (mit alten Screenshots).

Herzliche Grüße

Matthias Scharwies

[dedlfix]

Tach!

Warum ist alert nicht gut und wo kann ich console.log finden?

alert() gibt die Stringdarstellung eines Wertes als Meldung aus. console.log() hingegen schreibt in die Entwicklerkonsole, und zwar so, dass man da komplexe Objekte und Arrays untersuchen kann. Es ist also deutlich bessser geeignet, um Dinge zu untersuchen. Abgesehen davon gibt es auch noch den bereits erwähnten Debugger, um sich schrittweise durch den Code zu bewegen und die Werte mit Mausdraufhalten anzuzeigen.

dedlfix.

[JürgenB]

Hallo,

alert ist Scheisse(tm), wenn schon console.log

und wie debugge ich mit dem Smartphone?

Gruß
Jürgen

[Rolf B]

Hallo JürgenB,

und wie debugge ich mit dem Smartphone?

Ugh. Am besten gar nicht?

Am zweitbesten mit alert oder einem Extra-Textelement im Footer, wo man Protokoll-Infos hineinschreibt; je nach Umständen. Alert verzerrt das Timing, und ein Extraelement das Layout.

Oder so. Habe es noch nicht selbst gemacht, war jetzt nur einer der ersten Suchtreffer. Für iOS gibt's wohl auch was.

Rolf

[JürgenB]

Hallo Rolf,

debuggen auf mobilen Geräten mit alert ist für mich die einfachste Methode, wenn das Timing nicht wichtig ist, vor allem weil ich oft auf geliehen Geräten teste (Darf ich mal dein Handy nutzen?). Daher ist die Aussage „Alert ist Scheisse“ einfach nur Sch..

Gruß
Jürgen

[Horst]

Da sind ziemlich viele Entwicklertools, welches muss verwendet werden um zu gucken ob Javascript ausgeführt wird oder nicht und ob das ohne Fehler passiert?

Muss man dann aufwändig den Quellcode ändern und alert dazu machen oder kann man das alert auch direkt in den Entwicklertools hinzufügen?

[Matthias Scharwies]

Servus!

Hallo Horst,

wie kann man im Firefox prüfen, ob ein Javascript-Code ausgeführt wird und ob dies fehlerfrei passiert?

Eine Menge Entwicklertools findest du oben unter Extras. Da stehen auch die passenden Tastenkürzel.

Irgendwo fehlt mir das Verständnis wo oben ist. (Bei mir im FF59 heißt das "Web-Entwickler" und ist im Menü rtechts oben versteckt.

Die Konsole öffnest Du in den meisten Browsern mit F12.

Im Wiki gibt es einige Tutorials:

• HTML/Tutorials/HTML & CSS mit dem Seiteninspektor untersuchen

• JavaScript/Tutorials/Debuggen für Anfänger

  • bes. da: Die Konsole öffnen

Herzliche Grüße

Matthias Scharwies

[Henry]

Hallo Matthias,

Irgendwo fehlt mir das Verständnis wo oben ist. (Bei mir im FF59 heißt das "Web-Entwickler" und ist im Menü rtechts oben versteckt.

Erbsenzählerei?

• HTML/Tutorials/HTML & CSS mit dem Seiteninspektor untersuchen

• JavaScript/Tutorials/Debuggen für Anfänger

Interessant, wusste gar nicht, dass hier so was vertreten ist. (Hätte ich doch mal vorher eine Suchmaschine gefragt… 😉)

@beatovich

alert ist Scheisse(tm), wenn schon console.log

Ein wenig übertrieben, nicht wahr? Oder du solltest den hier verlinkten Wikiartikel/Tutorial vielleicht anpassen.

Gruss
Henry

[Matthias Scharwies]

Servus!

Hallo Matthias,

Irgendwo fehlt mir das Verständnis wo oben ist. (Bei mir im FF59 heißt das "Web-Entwickler" und ist im Menü rtechts oben versteckt.

Erbsenzählerei?

Nein, ich hatte (und habe) da lang Probleme mit den Plugins und Features von FF. Seit Quantum weiß ich nicht mehr wie man Lesezeichen in Verzeichnisse sortieren kann.

@beatovich

alert ist Scheisse(tm), wenn schon console.log

Ein wenig übertrieben, nicht wahr? Oder du solltest den hier verlinkten Wikiartikel/Tutorial vielleicht anpassen.

Anpassen bitte immer!

Gerade das JS-Tutorial könnte noch weiter ausgebaut werden.(siehe das ToDo ganz unten)

Herzliche Grüße

Matthias Scharwies

[Henry]

Hallo Matthias,

Nein, ich hatte (und habe) da lang Probleme mit den Plugins und Features von FF. Seit Quantum weiß ich nicht mehr wie man Lesezeichen in Verzeichnisse sortieren kann.

Das ist sowieso eine Frage, die ich mir oft stelle. Warum gibt es bisher bei keinem Browser eine gute Lesezeichenverwaltung. Können die nicht(eher unwahrscheinlich) oder wollen die nicht(nur warum… vielleicht weil man sich dann auch Dauer etwas unabhängiger von Suchmaschinen macht)?

Anpassen bitte immer!

gehört Überwindung zu, weil man(also zb. ich) nie sicher bin ob meine Änderung/Eintrag sinnvoll ist.

Gerade das JS-Tutorial könnte noch weiter ausgebaut werden.(siehe das ToDo ganz unten)

Das ist eine sehr gute Idee. Glaube auch aus typischen Fehlern lernt man schneller. Übrigens, habe da so einen Kandidaten, dem ich bisher, trotz Fehleranalyse, nicht auf die Schliche gekommen bin.

Gruss
Henry

[Matthias Apsel]

Hallo Henry,

alert ist Scheisse(tm), wenn schon console.log

Ein wenig übertrieben, nicht wahr?

console.log ist wesentlich mächtiger.

• vergleiche alert(document.querySelector('body')) vs. console.log(document.querySelector('body'))
• es erfordert keine Nutzeraktion
• es kann auch im Produktivcode stehen bleiben (ob es das sollte, ist eine andere Frage)

Bis demnächst
Matthias

[Henry]

Hallo Matthias,

alert ist Scheisse(tm), wenn schon console.log

Ein wenig übertrieben, nicht wahr?

console.log ist wesentlich mächtiger.

Es ging auch mehr um den ersten Teil des Satzes. Wenn's wirklich "scheisse" wär, gehört es auch nicht in's Turtorial, höchstens als "Niemals machen!".

Gruss
Henry

[beatovich]

hallo

Es ging auch mehr um den ersten Teil des Satzes. Wenn's wirklich "scheisse" wär, gehört es auch nicht in's Turtorial, höchstens als "Niemals machen!".

Ich habe gerade kürzlich im Wiki ein Gebrauch von alert durch console.log ersetzt. Das ist dort wohl eine Daueraufgabe.

[beatovich]

hallo

übrigens:

console.log(console);

Auch interessant.

[Matthias Apsel]

Hallo beatovich,

Ich habe gerade kürzlich im Wiki ein Gebrauch von alert durch console.log ersetzt. Das ist dort wohl eine Daueraufgabe.

Nun ja, wenn es darum geht, lediglich Werte auszugeben, könnte für den zufälligen Besucher ein alert durchaus besser sein. Die Konsole muss schließlich erst geöffnet werden.

Bis demnächst
Matthias

[beatovich]

hallo

Ich habe gerade kürzlich im Wiki ein Gebrauch von alert durch console.log ersetzt. Das ist dort wohl eine Daueraufgabe.

Nun ja, wenn es darum geht, lediglich Werte auszugeben, könnte für den zufälligen Besucher ein alert durchaus besser sein. Die Konsole muss schließlich erst geöffnet werden.

Du hast natürlich recht.

Nur hier https://wiki.selfhtml.org/wiki/JavaScript/DOM/Event/Pointer_Events gings nicht um ein ausführbares Beispiel.

Praktisch sollte man wohl beides kombinieren für Beispiele.

[dedlfix]

Tach!

Wenn's wirklich "scheisse" wär, gehört es auch nicht in's Turtorial, höchstens als "Niemals machen!".

Es ist nicht so, dass man damit was kaputtmacht. Es ist allerdings nur eingeschränkt brauchbar. Wer es für skalare Werte verwenden möchte, bekommt damit auch die gewünschte Ausgabe (wenn toString() nichts überschreibt). Nur wird man irgendwann Bedarf haben, komplexe Werte zu untersuchen, und dann wird es unbrauchbar. Mit console.log() (abgesehen vom Debugger) gibt es ein besseres und universelleres Werkzeug. Man kann alert() durchaus erwähnen, nur nicht favorisieren. Ein "niemals machen!" wäre aber eine unangemessene Empfehlung.

dedlfix.

[Henry]

Hallo dedlfix,

Man kann alert() durchaus erwähnen, nur nicht favorisieren.

Richtig und hat hier ja auch niemand favorisiert.

Ein "niemals machen!" wäre aber eine unangemessene Empfehlung.

Wie eben "scheisse" auch 😉

Gruss
Henry

[beatovich]

hallo

Mit console.log() (abgesehen vom Debugger) gibt es ein besseres und universelleres Werkzeug.

https://developer.mozilla.org/en-US/docs/Web/API/console#Outputting_text_to_the_console

erwähnt übrigens mehrere Methoden

• console.log()
• console.error()
• console.warn()
• console.info()

Man darf das Teil also mal etwas testen.

[dedlfix]

Tach!

https://developer.mozilla.org/en-US/docs/Web/API/console#Outputting_text_to_the_console

erwähnt übrigens mehrere Methoden

• console.log()
• console.error()
• console.warn()
• console.info()

Man darf das Teil also mal etwas testen.

Das sind Feinheiten für die dauerhafte Verwendung in Code. Wenn man nur Debuggen möchte, und die Anweisung hinterher wieder gelöscht wird, dann reicht console.log() völlig und hat gegenüber den anderen keinen Vor- oder Nachteil.

Anders sieht die Sache im dauerhaften Betrieb aus, wenn man da regelmäßig Konsolenausgaben erstellen möchte. Dann kann man über die genannte Methoden auch eine Abstufung der Meldungen vornehmen, was dann die Browser veranlasst, in der Konsole unterschiedliche Darstellungsformen zu wählen. Filtern nach Typ kann man meisten auch noch. Bei serverseitigem Javascript steuert man damit auch, in welchen Ausgabekanal die Meldung geschickt wird.

dedlfix.

[MudGuard]

Hi,

alert ist Scheisse(tm), wenn schon console.log

Ein wenig übertrieben, nicht wahr?

console.log ist wesentlich mächtiger.

• vergleiche alert(document.querySelector('body')) vs. console.log(document.querySelector('body'))
• es erfordert keine Nutzeraktion
• es kann auch im Produktivcode stehen bleiben (ob es das sollte, ist eine andere Frage)

• Bei console.log geht's sofort weiter mit dem Script. alert hält die Ausführung des Scripts an, bis der User bestätigt (ein Ajax-Request ist also ggf. schon beantwortet oder ein timer abgelaufen oder …, wenn das Script nach dem alert weiterläuft - geändertes zeitliches Verhalten).

cu,
Andreas a/k/a MudGuard

[dedlfix]

Tach!

wie kann man im Firefox prüfen, ob ein Javascript-Code ausgeführt wird und ob dies fehlerfrei passiert?

Kommt drauf an, was man genau möchte. Neben der Untersuchung von eigenem Code mittels Debugger und anderen Entwicklertools, gibt es auch Code, der zur Laufzeit Fehler erzeugen kann, und worauf man wenig Einfluss hat. Solche Blöcke kann man mit try-catch einrahmen, dann stirbt die Ausführung nicht ganz, sondern geht im catch-Zweig und darunter weiter. Ein Beispiel hierfür ist, zu parsender JSON-Code mit JSON.parse(). Wenn die Syntax der Daten nicht korrekt ist, gibt es eine Exception. Die kann der try-catch-Block auffangen und man kann darauf reagieren.

Kann man die Zeilen des Javascript Codes vielleicht sogar schrittweise ausführen lassen um dann zu prüfen welche Werte die Variablen nach jedem Schritt enthalten?

Wie erwähnt: Entwicklertools, Debugger.

dedlfix.