 |
Javascript soll es ermöglichen, interaktive Formulare auszulesen, sie zu prüfen und ggf. im Dialog mit dem Nutzer zu vervollständigen. Dazu müssen Texte manipuliert werden können. JavaScript besitzt ein spezielles Objekt, String genannt, dessen Instanzen ab der Version 1.2 alle möglichen Textmanipulationen beherrschen. Um also Textbefehle verwenden zu können, muß mindestens eine Instanz des String-Objektes erzeugt werden. Man könnte auch sagen, es müsseeine Stringvariable angelegt werden, das ist nicht ganzfalsch aber auch nicht ganz richtig. Trotzdem geht es, wiebei anderen Objekten auch, ganz einfach:
Ein String und seine Eigenschaft Die zu erzeugende Instanz des String-Objektes, kurz einString, muß einen Namen erhalten, der frei wählbarist.
<script language="JavaScript">
...
Möglichkeit 1:
adresse = new String()
adresse = "Number 10, Downing Street, The City ofGreat London" Möglichkeit 2:
name = new String ("Peter") Möglichkeit 3:
beruf = "Henker"
...
</script> |
Dieser String hat genau eine Eigenschaft, die nämlich,eine gewisse Länge zu besitzen. Erfragt wird sie mit
Wie man nun mühelos feststellen kann, wurden die Leerstellen
mitgezählt, was eine gewisse Logik hat. Wie kommt es
dazu, daß dieser Button funktioniert?
Nun, ich verrate es gerne:
Im <head> steht:
<script language="JavaScript">
var adresse = "Number 10, Downing Street,
The City of Great London";
function Laenge_zeigen(x)
{
alert ("Die Länge
von\n\"" + x + "\"\nbeträgt " + x.length
+ " Zeichen");
}
</script> |
eine Variable wird initialisiert
und eine allgemeine Funktionsdefinition
für die Bestimmung von String-Längen
vorgenommen
|
beim Button steht:
<form>
<input type=button value="wie lang?"
onclick="Laenge_zeigen(adresse);" >
</form> |
die Funktion wird mit dem Variablen-
namen als Argument aufgerufen, stattdessen
könnten auch mit anderen Stringvariablen oder Strings
aufgrufen werden. |
Methoden von String
Die Überschrift sagt präziser, als der Eintrag
im Übersichtsfenster, worum es geht. Das Objekt String
besitzt viele Methoden, die alle in der Form:
| stringname.methode oder "stringinhalt".methode |
aufgerufen werden und dann höchst erwünschte
Dinge mit dem String anstellen. Zur Übersicht eine
Tabelle der Methoden, die zur Formatierung einsetzbar sind.
In beiden Tabellen ist immer ein String des Namens "XX"
mit dem Inhalt "mein Testtext" verwendet worden.
String-Methoden zur Textformatierung
| anchor( ) |
es wird das <a>-Tag für Sprungadressen,
Markenname als Argument übergeben |
|
| big ( ) |
der Text wird vergrößert |
|
| blink ( ) |
Das <blink>-Tag wird gesetzt (geht nicht im
Explorer!) |
|
| bold ( ) |
der Text wird fett |
|
| fixed ( ) |
Schreibmaschinenschrift |
|
| fontcolor ( ) |
Textfarbe, Aufruf mit: XX.fontcolor("red"); |
|
| fontsize ( ) |
Schriftgröße, Aufruf hier mit: XX.fontsize(6);
mögliche Größen 1..7 |
|
| italics ( ) |
Kursivschrift |
|
| link ( ) |
Link erstellen, URL ist Argument |
|
| small ( ) |
kleinere Schrift |
|
| strike ( ) |
durchgestrichen |
|
| sub ( ) |
tiefergestellt |
|
| sup ( ) |
höhergestellt |
|
| toLowerCase ( ) |
Kleinbuchstaben |
|
| toUpperCase ( ) |
Großbuchstaben |
|
Anmerkung: Obwohl Netscape diese Befehle alle können
soll, funktionieren in meiner obigen Tabelle nicht alle.
Speziell die Befehle zur Größenänderung
werden in meinem Netscape 4.6-Browser ignoriert. Der Grund
könnte sein, daß hier die Style-Angaben der CSS
vorrangig befolgt werden.
Methoden zur Analyse und Manipulation von
Strings
| charAt ( ) |
welcher Buchstabe steht an der im Argument angegebenen
Positeon? Gezählt wird ab 0. Aufruf: XX.charAt(5); |
|
| charCodeAt(z) |
Latin-1-Codewert an einer Positeon z. (Ist bei unserem
Zeichensatz identisch mit dem Ascii-Code. Aufruf mit
charCodeAt(5), dem "T" |
|
| concat(str) |
Zeichenkette str anhängen. Aufruf: XX.concat("
ist schön"); |
|
| fromCharCode(c1,c2,..) |
Latin-1-Zeichenkette aus Code-Werten ci erzeugen,
hier Aufruf mit String.fromCharCode(84) |
|
| indexOf ( ) |
an welcher Positeon beginnt erstmals die im Argument
angegebene Zeichenfolge? Fehlmeldung ergibt -1. Aufruf
hier: XX.indexOf("t");. |
|
| lastIndexOf ( ) |
an welcher Positeon beginnt letztmalig die im Argument
angegebene Zeichenfolge? Fehlmeldung ergibt -1. Aufruf
hier: XX.lastIndexOf("t");. |
|
| match() |
Regulären Ausdruck anwenden.
Sucht alle Stellen, an denen "e" auftritt (Zählung) |
|
| replace(a,b) |
Regulären Ausdruck suchen
und ersetzen, Suche im String textteil a, ersetze
ihn durch textteil b; Aufruf hier mit XX.replace("mein","euer"); |
|
| search(a) |
Suchen nach der Positeon von a = teiltext oder Regulärem
Ausdruck. Aufruf: XX.search("T"); |
|
| slice(v,b) |
Teil aus Zeichenkette extrahieren. Im Argument stehen
v = von (inklusive), b = bis(exklusive). Aufruf: XX.slice(2,7); |
|
| split(a) |
Zeichenkette beim Zeichen oder Textteil a = Zeichen
oder Regulärem Ausdruck
aufsplitten. Es entsteht ein array mit den Teiltexten.
Aufruf mit teil=XX.split("e"); angezeigt werden teil[0],
teil[1], teil[2] und teil[3] |
|
| substr(v,z) |
Teilzeichenkette ab Positeon ermitteln. Im Argument
stehen v = von (inklusive), z = Zeichenzahl. Aufruf:
XX.substr(2,7); |
|
| substring (v,b) |
Schneidet einen Teil des Strings aus. Im Argument
stehen von (inklusive),bis(exklusive). Aufruf: XX.substring
(2,7); |
|
Escape-Zeichen zur Formatierung
Bevor längere Texte an ihre Ziele geschickt werden,
müssen sie in irgendeiner Weise mit Steuerzeichen für
Formatierung, Umbruch, unzulässige Zeichen etc. versehen
werden. Welche Möglichkeiten es gibt, zeigt die folgende
Tabelle. Es gibt, aus C entlehnt, sog. Escape-Codes dazu.
Ihre Namen sind weitgehend selbsterklärend. Sie werden
einfach in den Text eingefügt.
Escape-Codes
| \b |
Backspace |
| \f |
Formfeed = Seitenvorschub |
| \n |
New Line = Zeilenumbruch |
| \r |
Carriage Return = neue Zeile |
| \t |
Tabulator |
| \' |
einfaches Anführungszeichen innerhalb eines
Strings |
| \" |
normales Anführungszeichen innerhalb eines
Strings |
| \\ |
Backslash innerhalb eines Strings |
Reguläre Ausdrücke
Einige der Stringfunktionen erlauben es, Texte nach ausgewählten
Worten, allgemeiner nach beliebigen Zeichenfolgen, zu durchsuchen.
Einfache Suchmuster etwa für match() bestehen
einfach aus dem gesuchten Text. Wird der Text gefunden,
wird er selbst zurückgemeldet, gibt es ihn im untersuchten
Text nicht, wird "null" zurückgemeldet.
Also:
<script language=JavaScript>
text="Ich mag keine Feiern ohne Eiersalat";
document.write("Sch"+text.match("xy")+text.match("i"));
</script> |
ergibt:
Man kann ohne diese Errungenschaft leben.
Aber, es geht sinnvoller.
Reguläre Ausdrücke, die nicht eigens für
JavaScript erfunden wurden, sondern aus der UNIX-Welt kommen
und etwa in PERL sehr häufig genutzt werden, ermöglichen
es, nach Zeichenfolgen zu suchen, die allgemein gekennzeichnet
worden sind und, wenn vorhanden, konkret zurückgemeldet
werden. Wird gleich klarer. Wer ein Datum etwa der Form
12.12.99 sucht, kann den regulären Ausdruck
\d\d\.\d\d\.\d\d nutzen. Dabei steht \d
für ein beliebiges Zahlzeichen. Reguläre Ausdrücke
werden, anders als normale Textabschnitte, nicht durch Anführungsstriche,
sondern durch Slashes / abgegrenzt. Gefunden und gemeldet
werden beliebige Daten, die diesem Muster entsprechen.
Beispiel:
<script language=JavaScript>
text="Das Semester endet am 12.07.01.
Jedenfalls könnte es so sein.";
document.write(text.match(/\d\d\.\d\d\.\d\d/));
</script> |
ergibt also:
.
Reguläre Ausdrücke werden wie im Beispiel direkt
angegeben oder durch einen "Konstruktor" RegExp
erzeugt. Er wird ernsthaft höchstens dann benötigt,
wenn das Suchmuster erst zur Laufzeit erzeugt wird.
| RegAus=new RegExp("Dieser Text"); |
Was kann ausgedrückt werden?
| \A |
Zeichenkette fängt mit dem auf \A folgenden
Ausdruck an |
| \b |
Die nach \b angegebene Zeichenkette kommt vor, mit
\b ohne etwas danach wird insbesondere auf das Wortende
geprüft |
| \B |
Das Gegentum zu \b, aber das begreift keine Sau! |
| \d |
steht für Zahlzeichen von 0 bis 9 |
| \D |
alle Zeichen, außer Zahlen |
| \n |
Zeilenumbruch |
| \s |
alle Zeichen, die einen Leerraum erzeugen |
| \S |
alles, was nicht zu \s gehört |
| \w |
Buchstaben, Zahlen oder Unterstrich (_) aber keine
Umlaute |
| \W |
alles, was nicht zu \w gehört |
| \\ |
Backslash |
| * |
kein oder beliebig viele beliebige Zeichen |
| + |
Angabe muß mindestens einmal vorkommen |
| . |
steht für ein beliebiges Zeichen |
| ? |
Angabe darf höchstens 1mal vorkommen |
| ^ |
Anfang einer Zeichenkette |
| $ |
Ende einer Zeichenkette |
Reguläre Ausdrücke können durch Steuerzeichen
noch beeinflußt werden. Man nennt sie Flags.
Diese werden einfach an den regulären Ausdruck angehängt.
Im folgenden Beispiel ist das i als Flag wirksam. Es führt
dazu, daß Groß- und Kleinschreibung ignoriert
wird. Gefunden werden also auch Textanfänge mit "mein
TEXT beginnt" etc.
| RegAus=/\aMein Text beginnt\i/ |
Die folgende Liste zeigt die zugelassenen Flags. Bitte
verklage mich aber keiner, wenn sein selbstgebauter Browser
sie nicht kennt. Ich habe sie nicht ausprobiert!
| g |
die komplette Zeichenkette wird durchsucht |
| i |
Groß- und Kleinschreibung wird als gleichwertig
behandelt |
| m |
behandelt den zu durchsuchenden String, als würde
er aus mehreren Zeilen bestehen |
| s |
findet mit dem Pattern . auch Zeilenumbrüche |
| x |
ignoriert Lerräume im regulären Ausdruck |
Abschließende Übung:
Wie testet man eine Texteingabe daraufhin, ob es eine E-Mail-Adresse
ist? Der reguläre Ausdruck, der jede wirkliche E-Mail-Adresse
findet, aber ungültige, deren Syntax stimmt, natürlich
nicht ausscheiden kann:
| if (eingabetext.match(/\w.*@\w.*\.\w.*/)!=null)
... dann kann es eine E-Adresse sein! |
Nutzung der Stringmethoden
Alle Methoden sind in den Beispielspalten beider Tabellen
auf einen global definierten String XX = "mein Testtext"
angewandt. Ein solcher Aufruf erfordert natürlich eine
spezielle Syntax. Die JavaScript-Methoden sollen ja innerhalb
eines HTML-Scripts ausgeführt werden und sie sollen
ihr Ergebnis in die Tabelle schreiben. Erreicht wird dies
durch den folgenden Code, als Beispiel diene die letzte
Zeile der Formatierungstabelle.
<table ...>
...
<tr>
<td>toUpperCase ( )</td>
<td>Großbuchstaben</td>
<td><script >document.write(XX.toUpperCase());</script></td>
</tr>
</table> |
Man erkennt, die Adressierung der Ausgabe, die ins Dokument
hinein erfolgt, wird durch den Ort des Aufrufes erreicht.
Beim <script>-Aufruf kann hier, bei wiederholtem Aufruf
die Angabe der Scriptsprache entfallen, es sei denn, es
werden mehrere Scriptsprachen auf einer Seite genutzt. Der
Methodenaufruf erzeugt hier einen neuen String, der in das
Dokument geschrieben wird.
Alternativ könnte natürlich auch mit der Syntax:
stringname2 = stringname1.methode bzw. stringname
= stringname.methode eine Zuweisung an eine neue
oder die alte Stringvariable erfolgen. Der veränderte
String stünde dann für weitere Manipulationen
zur Verfügung.
|
|
|
DIENSTE
