Lib für dynamisches HTML ab Netscape 4 und MSIE 4

[Bernd Sielaff]

Hallo zusammen,
unten eine Minilib, bestehend aus zwei Funktionen, die dynamisches HTML auch für ältere Browser ab Netscape 4 und MSIE 4 unterstützt. Damit lassen sich mit nur einer Funktion 'property' Bilder austauschen (onmouseover), Texte verändern, Stylesheeds wie fontSize und color verändern, Bilder zoomen, Objekte anzeigen und verbergen (visible, hidden) und auch verschieben (top, left). Und es lassen sich gesetzte Werte auslesen.

Aufgerufen werden kann 'property' z.B. wie folgt:
property('','div3','style','left','360','top','130')
property('div2','img1','img','src','../media/button_h.jpg')
property('','div3','style','visibility','hidden')
property('div1','txt1','text','data','dies ist der neue Text','fontSize','20px','color','#FFCF52')
aktSrc=property('div2','img3','img','src','get')

Getestet ist die Lib für Netscape 4, 4.7, 6.2 und für MSIE 4, 5, 5.5 und für Opera 6.2, alles unter Windows. Ausprobiert werden kann die Lib auf der Site http://www.onyx-multimedia.de/htm/dynhtml.htm
Dort sind auch die möglichen Funktionsaufrufe ausführlich dokumentiert. Eingebunden in ein Projekt ist die Lib auf
http://www.onyx-multimedia.de/htm/onyx.htm

Um das Ding zusammenzukriegen, habe ich ungezählte Stunden in diesem und anderen Foren und Sites verbracht. An dieser Stelle einmal einen ganz herzlichen Dank an die diversen Autoren und insbesondere an Stefan Münz für sein fabelhaftes SELFHTML!

Ich stell' das Ding aus drei Gründen hier ins Forum, weil ich:
1.) allen Newcomern die zeitraubende Suche insbesondere nach Netscape 4 Handling erleichtern möchte,
2.) die Bitte habe, mir Rückmeldung über Probleme bei mir nicht verfügbaren Browsern zu geben,
3.) Opera nicht vollständig in den Griff kriege.
Zu 3.) Offensichtlich unterstützt Opera auch in der Version 6.2 immer noch nicht 'FirstChild' und 'data', sodass hier Textzuweisungen und Bilderzoom nicht funktionieren, sonst aber alles. Ein vernünftiger Workaround ist mir nicht eingefallen. Der bei Netscape notwendige Weg Childs mit document.write neu rauszuschreiben, ist mir bei Opera nicht gelungen, da ich keinen Weg für die spezifische Objektansprache gefunden habe. Falls hier jemand noch eine zündende Idee hat, wäre ich dankbar.
Danke und Ciao
Bernd

//xxx property() xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
function property() { // V1.1 //
 // author: Bernd Sielaff  <a href="http://www.onyx-multimedia.de">Onyx</a>  copyleft: everybody //
 var obj, doAction=true, args=property.arguments;
 var divName=args[0],objName=args[1],what=args[2],attr=args[3],newValue=args[4];
 if (document.layers) {
  if (!(obj=document.layers[objName])) {
   for(var i=0; !obj && i < document.layers.length; i++)
    obj=document.layers[i].document[objName];
  }
  doAction=false;
  if (attr=='top'||attr=='left'||attr=='visibility'||attr=='src')
   doAction=true;
 }
 if (document.getElementById) {
  obj=document.getElementById(objName)
  if (!obj)
   obj=document.getElementsByName(objName)[0];
 }
 if (document.all)
  obj=document.all[objName];
 switch (what) {
 case('text'):
  if (document.all)
   attr='innerHTML';
  else {
   if (document.getElementById&&!window.opera)
    obj=obj.firstChild;
  }
  break;
 case('style'):
  if (document.getElementById || document.all)
   obj=obj.style;
  break;
 }
 if (newValue=='get') {
  if (obj)
   return obj[attr];
  else
   return 'undefined';
 }
 else {
  if (obj&&doAction) {
   obj[attr]=newValue;
   if (args.length>5) {
    if (args[2]=='text')
     args[2]='style';
   for(var i=5;i<args.length;i+=2)
    property(args[0],args[1],args[2],args[i],args[i+1]);
   }
  }
  else
   netscapeBrowser(args);
 }
 return true;
}
//xxx netscapeBrowser() xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
function netscapeBrowser(args) { // V1.1 //
 // author: Bernd Sielaff  <a href="http://www.onyx-multimedia.de">Onyx</a>  copyleft: everybody //
 var vSrc, outString, styleParam, divName=args[0],objName=args[1],what=args[2],attr=args[3],newValue=args[4];
 switch (what) {
 case ('img'):
  for (var i=3; i<args.length; i+=2) {
   switch (args[i]) {
   case ('width'): vWidth=args[i+1];  break;
   case ('height'):vHeight=args[i+1]; break;
   }
  }
  vSrc=property(divName,objName,'img','src','get');
  outString='<img name="'+objName+'" src="'+vSrc+'" width="'+vWidth+'" height="'+vHeight+'" border="0">'
  break;
 case ('text'):
  for (var i=5; i<args.length; i+=2) {
   switch (args[i]) {
   case ('fontFamily'): vFontFamily=args[i+1]; break;
   case ('fontWeight'): vFontWeight=args[i+1]; break;
   case ('color'):   vColor  =args[i+1]; break;
   case ('fontSize'):   vFontSize =args[i+1]; break;
   }
  }
  styleParam='style="'+'font-family:'+vFontFamily+';'+'font-weight:'+vFontWeight+';'
        +'color:'+vColor+';'+'font-size:'+vFontSize+';';
  outString='<p id="' + objName + '" ' + styleParam + '">' + newValue + '</p>';
  break;
 }
 document[divName].document.clear();
 document[divName].document.write(outString+'\n');
 document[divName].document.close();
 return true;
}