Kalenderblatt

Zur Erinnerung wollen wir diese zunächst noch einmal betrachten:

function gMon() {
  this[0] = 'Januar';
  this[1] = 'Februar';
  this[2] = 'März';
  this[3] = 'April';
  this[4] = 'Mai';
  this[5] = 'Juni';
  this[6] = 'Juli';
  this[7] = 'August';
  this[8] = 'September';
  this[9] = 'Oktober';
  this[10] = 'November';
  this[11] = 'Dezember';
}

var monNames = new gMon();

Dieser Code erzeugt ein Objekt vom Typ gMon(), welches wir so deklariert haben, dass es zwölf Elemente repräsentiert, jedes eine Zeichenkette mit einem Monatsnamen.

Kürzer geht dies auch so

  var monNames = new Array('Januar', 'Februar', 'März',
    'April', 'Mai', 'Juni', 'Juli', 'August', 'September',
    'Oktober', 'November', 'Dezember');

Dies hat jedoch den Nachteil, dass es einen JavaScript v1.1 Browser benötigt, da Array nicht in JavaScript v1.0 definiert ist.

Bei Scripten sollte man – nach Meinung des Autors – versuchen, einen möglichst kurzen Source zu erreichen.

Bedenken Sie bitte, dass jeder Benutzer die Daten übertragen muss (und das selbst dann, wenn der Benutzer kein JavaScript oder die Unterstützung abgeschaltet hat). (Auf die Auslagerung der Scripte gehen wir hier nicht ein.).

Einbettung

Eine Idee, die sowohl JavaScript 1.0-kompatibel ist, als auch kurzen Source erzeugt, ist, das Feld in einen String einzubetten und auf die einzelnen Elemente via substring zuzugreifen.

var monNames = 'Januar   Februar  März'
             + 'April    Mai      Juni     '
             + 'Juli     August   September'
             + 'Oktober  November Dezember ';

Wir bemerken "September" als das mit neun Zeichen längste Element. Um die Einbettung zu vollziehen, schreiben wir alle Elemente der Reihe nach in einen String, wobei kürzere Elemente mit Leerzeichen erweitert werden.

Das i-te Element beginnt also bei Index i*9, oder allgemeiner i*Länge längstes Element.

Auf Zeichenketten ist die substring-Methode definiert, die einen durch Anfangs- und Endindex beschriebenen Teilstring liefert.

funtion getMonth(i) {
  return monNames.substring(i*9, (i+1)*9);
}

Kalenderblatt

Kommen wir nun zu unserem Beispiel.

Wir wollen ein kleines Kalenderblatt erzeugen, welches Wochentag, Tag des Monats und Monat anzeigt. Um einen netten Effekt zu erreichen, betten wir die Ausgabe in eine Tabelle ein, für die wir eine Hintergrundfarbe festlegen.

Wir erhalten:

<script type="text/javascript"><!--
  var today = new Date();
  var m = today.getMonth();
  var ms = ('Januar   Februar  M&auml;rz'
         + 'April    Mai      Juni     '
         + 'Juli     August   September'
         + 'Oktober  November Dezember ').substring(m*9,m*9+9);

  var wd = today.getDay();

  var wds = ('Sonntag   Montag    Dienstag  Mittwoch  '
          + 'DonnerstagFreitag   Samstag   ').substring(wd*10,wd*10+10);

  document.write('<center><table bgcolor="#eeeeff" border="1"'
    + ' cellspacing="0" cellpadding="3"><tr><td><center>');
  document.write(wds.fontsize(2),"<br>");
  document.write((""+wd).bold().fontsize(7),"<br>");
  document.write(ms.fontsize(2));
  document.write('</center></td></tr></table>',
    '<font face="arial,helvetica,sans-serif" size="1">',
    '<a href="https://brauchbar.de" target="_top">',
    'by brauchbar</a></font>','</center>');
//-->
</script>

So sieht es bei Ihnen aus:

Sie sehen, dass Sie die Darstellung aleicht anpassen, und zum Beispiel im weitere Aspekte erg/auml;nzen könnten. Einige Anregungen und Routinen finden Sie im JavaScript-Workshop: Datum und Zeit.