JavaScript Development Console

HOT! Scharfe Artikel

Geocaching

Projekte

Juni 6th, 2007 10:16 Uhr von Ronald

Was ist die JavaScript Development Console (JSDC)?

Dieses kleine Tool soll die Arbeit mit JavaScript vereinfachen. Jeder der schon mal mit JavaScript aufwändigeren Quellcode programmiert hat weiß, wie mühselig die Ausgabe von Variablen ist. Generell hat man nur wenige Möglichkeiten “mal eben” eine Variable auszugeben. Die schnellste Möglichkeit ist dabei natürlich die alert()-Funktion. Aber innerhalb einer Schleife alert()-Ausgaben zu machen ist keine spaßige Angelegenheit. Eine andere Möglichkeit wäre, mit document.write() Ausgaben zu machen, aber auch das ist einiges an Schreibarbeit und das Ergebnis landet ziemlich weit unten auf der Seite oder mitten im Text. Gerade in der Zeit von Web 2.0 sind AJAX-Status-Meldungen und XML-Rückgaben ein wichtiger Bestandteil geworden. Da mich die ständigen alert()-Popups in den Wahnsinn getrieben haben, wollte ich endlich eine vernünftige JavaScript-Konsole haben, auf der ich schnell und einfach auch große Datenmengen ausgeben kann. Ich denke, es ist mir gelungen!

Kann ich JSDC testen?

Hier geht es zur kleinen Demonstrationsseite.

Download

Download hier oder http://blog.rvi-media.de/jsdc/jsdc.js zur Direkteinbindung.

Wie bindet man die JSDC ein?

Eingebunden wird die Konsole über ein ganz normales “<script>”-Element im Header (oder sonst wo).

Beispiel:

Wie mache ich eine Ausgabe in die Konsole?

Dafür stehen die Funktion report() zur Verfügung. Der Name der Funktion war während der Entwicklung alert2(), weshalb die Funktion auch weiterhin darüber ansprechbar ist.

report(“text”);
alert2(“text”);

Zusätzlich steht noch die folgende Funktion bereit, die HTML nicht in Entities umwandelt, sondern auch als HTML auf der Konsole ausgibt:

reportHTML(“<b>text</b>”);

Sobald Text in die Konsole gegeben wird, versucht die Konsole sich zu öffnen. Das gelingt allerdings nur, wenn das <body>-Element schon gerendert wurde. Deshalb können report()-Ausgaben im <head>-Bereich der HTML-Datei nicht sofort sichtbar werden.

Was sind die Eigenschaften der JSDC?

Einfache Einbindung
Voll funktionstüchtig mit den meisten Browsern (Firefox, Internet Explorer 7, Opera), eingeschränkt mit Internet Explorer <= 6
Inhalt kann geleert werden
Die Konsole kann minimiert und wieder vergrößert werden
Die Konsole merkt sich per Cookie ob sie beim Seitenaufbau und Textinhalt “aufpoppen” soll

Unter welchen Bedingungen darf die JSDC eingesetzt werden?

Die JavaScript Developer Console steht unter den Lizenzbedingungen der GNU General Public License (GPL).

Welche Inkompatibilitäten sind bekannt?

Damit die JDSC im Internet Explorer 7 am Bildschirmrand “mitfliegt” muss darauf geachtet werden, dass der Quirksmode (Kompatibilitätsmodus) nicht aktiviert ist. Auf Grund dessen funktioniert das Feature des “Schwebens” auch nicht in Internet Explorer-Version kleiner oder gleich der 6er-Reihe.

Der Transparenz-Effekt ist für den Internet Explorer derzeit deaktiviert, da er die z.T. die Funktionalität der ganzen Konsole lahmgelegt hat. Sobald ich eine Lösung bzw. den genauen Grund finde, werde ich die Transparenz wieder einschalten.

Teile und genieße Diese Icons verzweigen auf soziale Netzwerke bei denen Nutzer neue Inhalte finden und mit anderen teilen können.