JavaScript für Alle!

[Beschreibung] [Quelltext] [Erläuterung] [Referenz]

Fernbedienung

Beschreibung

Es wird ein kleines Steuer-Fenster gestartet, mit dem Sie durch die Seiten dieser JavaScript-Einführung blättern können.

Quelltext

function start_rc():

<script language="JavaScript">
<!--
  rc_win=null;
  function start_rc() {
    rc_win=window.open("","rc_win","directories=0,location=0,menubar=0,resizeable=1,scrollbars=0,status=0,toolbar=0,width=40,height=140");
    if(rc_win != null) {
      if(rc_win.opener == null)rc_win.opener=self;
      href=window.location.href.toLowerCase();
      href=href.substring(0, href.indexOf("seite"));
      rc_win.location.href=href+"rc_win.htm";
    } else {
      alert("das ging in die Hose");
    }
  }
//-->
</script> 

rc_win.htm:

<head>
<script language="JavaScript">
<!--
  var MAX=16;
  var page=0;
  var href="";
  var hnew="";
  var imag=-1;

  function go(pnew) {
    page=pnew;
    if(page < 0) {
      page=0;
    } else if(page > MAX) {
      page=MAX;
    }
    show();
    opener.location.href=hnew;
  }

  function show() {
    d1=Math.floor(page/10);
    d2=page-10*d1;
    if(imag == 1) {
      document.images["zehner"].src="rc_"+d1+".gif";
      document.images["einer"].src="rc_"+d2+".gif";
    } else {
      document.form1.page.value=page;
    }
    hnew=href+d1+d2+".htm";
  }
//-->
</script>
</head>

<body background="rc_bg.gif">
<center>
<script language="JavaScript">
<!--
  if(window.focus != null)window.focus();
  if(document.images != null) {
    document.write("<nobr><img src=\"rc_0.gif\" width=15 height=20 name=\"zehner\">");
    document.write("<img src=\"rc_0.gif\" width=15 height=20 name=\"einer\"></nobr><br>");
    imag=1;
  } else {
    document.write("<form name=\"form1\"><input name=\"page\" type=\"integer\" size=2 maxlength=2></form>")
    imag=0;
  }

  href=opener.location.href;
  ii=href.indexOf(".htm");
  if(ii >= 2) {
    page=eval(href.substring(ii-2, ii));
    href=href.substring(0, ii-2);
  }
  show();
//-->
</script>
<a href="#" onClick="go(page+1);"><img src="rc_next.gif"  width=29 height=23 border=0></a><br>
<a href="#" onClick="go(page-1);"><img src="rc_prev.gif"  width=29 height=23 border=0></a><br>
<a href="#" onClick="go(page);"><img src="rc_again.gif" width=29 height=23 border=0></a><br>
<a href="#" onClick="go(0);"><img src="rc_index.gif" width=29 height=23 border=0></a><br>
</center>
</body>

Erläuterung

Die in dieser Seite enthaltene JavaScript-Funktion "start_rc" öffnet ein neues Browser-Fenster und lädt in diesem Fenster das HTML-Dokument "rc_win.htm". In JavaScript V 1.1 wird im window-Objekt automatisch die Eigenschaft opener gesetzt, die auf das eigene Fenster zeigt. Damit die Fernbedienung auch unter V 1.0 läuft wird diese Eigenschaft gegebenenfalls vom Script ergänzt.

Das Aussehen der im Steuer-Fenster dargestellten Seite unterscheidet sich je nachdem, ob der verwendete Browser JavaScript V 1.1 und damit das image-Objekt unterstützt oder nicht. Falls das image-Objekt verwendet werden kann, wird die Seitenzahl im "Display" der "Fernbedienung" durch GIF-Bilder angezeigt. Wenn dies nicht möglich ist, wird ein Eingabefeld zum Anzeigen der Seitenzahl verwendet.
Mit der ebenfalls erst ab V 1.1 vorhandenen Methode window.focus() stellt sich das Fenster, in dem die Fernbedienung dargestellt wird, in den Vordergrund.


Referenz

[
Objekt-Hierarchie] [window-Objekt] [document-Objekt] [document.clear()]

Objekt-Hierarchie

In der folgenden Tabelle wird die Hierarchie der verschiedenen JavaScript-Objekte dargestellt:
window-
Objekt
parent,
self,
top
frames-
Array
history-
Objekt
history-
Array
V 1.1
location-
Objekt
document-
Objekt
anchors-
Array
forms-
Array
elements-
Array
links-
Array
applets-
Array
V 1.1
embeds-
Array
V 1.1
images-
Array
V 1.1
navigator-
Objekt
Z.B. das forms-Array ist Kind vom document-Objekt, dieses wiederum ist Kind vom window-Objekt. Das forms-Array wird damit mit "window.document.frames[]" angesprochen.
Auf die Angabe des führenden "window." beim Zugriff auf JavaScript-Objekte kann im Allgemeinen verzichtet werden.
 

window-Objekt

Verschiedene Elemente des window-Objektes wurden bereits an unterschiedlichen Stellen dieser Dokumentation besprochen. Hier noch einmal alle Elemente im kurzen Überblick:

Eigenschaften:
documentdocument-Objekt
locationlocation-Objekt
defaultStatusStandard-Meldung in der Status-Zeile
frames[] frames-Array
length Anzahl der frames
name Name des Fensters
parent
self
top

window
Synonyme für Fenster in einem Frame-Set
statusText in der Status-Zeile

Methoden:
alert()Warnung ausgeben
close()Fenster schließen
confirm()Ja/Nein-Abfrage
open()Fenster öffnen
prompt()Eingabe abfragen
setTimeout()Timer setzen
clearTimeout()Timer löschen

Ereignisse:
onLoad()Seite wurde geladen
onUnload()Seite wurde verlassen

 

document-Objekt

Verschiedene Elemente des document-Objektes wurden bereits an unterschiedlichen Stellen dieser Dokumentation besprochen. Hier noch einmal alle Elemente im kurzen Überblick:

Eigenschaften:
history history-Objekt
alinkColor Farbe für aktive Links
anchors[] anchor-Array
bgColorHintergrundfarbe
cookiecookie's
fgColor Vordergrundfarbe
forms[] forms-Array
lastModified letztes Änderungs-Datum
linkColor Farbe für Links
links[] links-Array
location URL des Dokuments
Achtung: nicht verwechseln mit dem window.location-Objekt !
document.location ist eine Eigenschaft, die nur gelesen werden kann.
referrer URL des rufenden Dokuments
title Titel
vlinkColor Farbe für besuchte (visited) Links
Das Symbol kennzeichnet Eigenschaften, die nur gelesen, nicht aber geschrieben werden können.

Methoden:
clear()löschen
close()schließen
open()öffnen
write()schreiben
writeln()schreiben mit Zeilenumbruch

document.clear()

Die Methode document.clear soll laut Original-Dokumentation von Netscape zur Browser-Version 2.0 bewirken, daß alle Ausgaben, die bisher in das aktuelle Dokument vorgenommen wurden, gelöscht werden. Hierzu soll die Kombination der beiden folgenden Anweisungen verwendet werden:
  document.clear();
  document.close();
In keinem der von mir eingesetzten Browser konnte ich diese Wirkung nachvollziehen.
In Netscapes JavaScript-Dokumentation zur Browser-Version 3.0 habe ich die Methode clear nicht mehr wiedergefunden.


Auf der nächsten Seite mischen wir Vorder- und Hintergrund-Farben

Erstellt von © Uwe Brinkmann - bingo e.V. - Stand 03.02.97