[Umleitungen]

Umleitungen oder sogenannte Browserweichen werden immer dann benötigt, wenn browserspezifische, proprietäre Befehle eingesetzt werden, die ein bestimmter Browsertyp nicht oder in anderer Syntax oder erst ab einer gewissen Version kennt. Umleitungen werden auch oft verwendet, um Webseiten in einer auf die Auflösung des Bildschirms abgestimmten Version anzuzeigen.

Die Weichen werden oft mittels eines JavaScripts gestellt, eine Ausnahme sind die Conditional Comments von Microsoft.

Weichenstellung mit JavaScript

Die gängige Variante in JavaScript ist eine if ... else ... Abfrage, wobei hier bestimmte Bedingungen gestellt werden, die erfüllt werden müssen, um eindeutig auf einen Browser oder was auch immer schliessen zu können.

Die Abfrage nach browserspezifischen Objekten stellt hier ein Methode dar, die oft in der Programmierung von DHTML- Scripts zum Zuge kommt. Bekanntlich setzten Microsoft und Netscape unterschiedliche DHTML- Modelle ein, die sich erst ab Version 6 dem W3C- Standard des DOM annähern.

Netscape verwendete bis Version 4.7x das Objekt layers, welches Microsoft- Browser nicht und Netscape 6 nicht mehr kennen, der Explorer setzte bis Version 5 auf das all Objekt, welches Netscape unbekannt ist. Ab Version 6 (IE ab 5) wird von beiden Herstellern das getElementbyId Objekt unterstützt.

So ist es mitunter unumgänglich, nach Browser UND Version zu unterscheiden. Das folgende Beispiel macht eine Abfrage auf bestimmte Objekte, als Ergebnis resultiert jeweils ein true (wahr) oder false (falsch), welches nachträglich innerhalb von if ... else Fallunterscheidungen verwendet werden kann:

<script language="JavaScript">
var nn4= (document.layers);
// Netscape Version 4 und älter
var nn6= (document.getElementById && !document.all);  // Netscape ab Version 6
var ie4= (document.all && !document.getElementById);  // Explorer Version 4 und älter
var ie5= (document.all && document.getElementById);  // Explorer ab Version 5

function irgendwas() {

if (nn4) { ..... auszuführender Code .....}
else if (nn6) { .... auszuführender Code ....}
.....
}
</script>

Eine weitere Möglichkeit, nach dem Browser zu unterscheiden, ist die Abfrage des Objekts navigator. Dieses Objekt stellt unterschiedliche Eigenschaften zur Verfügung (appName, appVersion und ggf. userAgent), nach denen der Browser erkannt werden kann.

var browser = navigator.appName;

Netscape speichert in dieser Eigenschaft beispielsweise den Wert "Netscape", der MS Internet Explorer den Wert "Microsoft Internet Explorer".

if browser == "Netscape" {....}

if(navigator.appVersion.substring(0,1) == "4")

Der Wert von navigator.appVersionumfasst mehr als nur die reine Produktversion.
Netscape 4.01 liefert z.B. folgenden Wert: "4.01 [en] (Win95; I)"
der MS Internet Explorer 4.0 liefert z.B.: "4.0 (compatible; MSIE 4.0; Windows 95)"

Um Teile aus einer solchen Zeichenkette zu extrahieren, kann die Methode substring() verwendet werden.

var browser = navigator.userAgent;

Mögliche Rückgabewerte sind Mozilla/5.0 [en] (WinNT; I) (Netscape) oder Mozilla/4.0 (compatible; MSIE 5.0; Windows 95) (Explorer).

Um Teileaus einer solchen Zeichenkette zu extrahieren, kann die Methode indexOf() verwendet werden:

if browser.indexOf("Opera 5")>-1 {.......}

Hier nun noch eine Variante, die alle oben genannten Möglichkeiten beinhaltet:

function lib_bwcheck(){
this.ver=navigator.appVersion
this.agent=navigator.userAgent
this.dom=document.getElementById?1:0
this.opera5=this.agent.indexOf("Opera 5")>-1
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0;
this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;
this.ie4=(document.all && !this.dom && !this.opera5)?1:0;
this.ie=this.ie4||this.ie5||this.ie6
this.mac=this.agent.indexOf("Mac")>-1
this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)
return this
}
var bw=new lib_bwcheck()

Eine Weichenstellung, die nach der Bildschirmauflösung unterscheidet, lässt sich leicht mit screen.width  und/oder screen.height erstellen.

<SCRIPT language="JavaScript">
<!--
scre = screen.width;
if (scre == "1280")location.href="1280.html";
else if (scre == "1024")location.href="1024.html";
else if (scre == "800")location.href="800.html";
else if (scre == "640")location.href="640.html";
//-->
</SCRIPT>

Conditional Comments

"Conditional Comments" sind einfacher zu handhaben als Umleitungen via JavaScript und sollten für einfache Zwecke bereits ausreichen.

Diese Art der Weichenstellung funktioniert nur mit dem Internet Explorer Version 5 und höher. Damit wird es möglich, Funktionen einzubauen, die nur von diesen Browsern interpretiert werden. Alle anderen ignorieren die entsprechenden Passagen.

Die Syntax ist eine Art erweiterter Kommentar. Wer schon einmal Server Side Includes für diesen Zweck eingesetzt hat, wird es wieder erkennen.

<!--[if IE 5]>
Hier der HTML Code, der für den IE vorgesehen ist.
<![endif]-->

Damit rücken proprietäre Funktionen wie Filter, Laufschriften und ähnliches wieder in den Blickpunkt. Selbstverständlich muss man darauf achten, dass inhaltlich nichts verloren geht.

Die "Conditional Comments" wurden von Microsoft mit verschiedenen Möglichkeiten ausgestattet:

!  "nicht"
lt  "kleiner als"
lte  "kleiner als oder gleich"
gt  "größer als"
gte  "größer als oder gleich"

Damit wird es möglich, verschiedene Versionen des IE exakt anzusteuern, wenn man denn mag.

<!--[if gte IE 5]>
Sie verwenden einen IE5 oder höher
<![endif]-->

Um beispielsweise einen Bookmarklink einzubauen, codieren Sie wie folgt:

<!--[if IE ]>
<a href="javascript:window.external.
AddFavorite('http://www.nightfire.ch', 'Nightfire Java Archiv')">
Zu Favoriten hinzuf&uuml;gen</a>
<![endif]-->

 


zurück

Copyright © 1998- Nightfire Java Archiv Tutorial No: 7