Thomas: document.write() - warum ersetzt das alles?

Hallo!

Ich habe folgenden Quelltext:

function set_style() {
  if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0,1)) == "4"))
   document.write('<link rel="stylesheet" href="style2.css" type="text/css">');
  else document.write('<link rel="stylesheet" href="style.css" type="text/css">');
 }

Sobald die Funktion geladen wird, wird der restliche Quelltext durch den Part ersetzt, der in docuent.write() steht. Aber ich will doch nur das im Head stehen haben.

Dann habe ich mal gesucht, im Forum und überall, habe einen ählcen artikel gefunden: http://forum.de.selfhtml.org/archiv/2002/7/16039/#m89843

da stht was von document.open(); und document.close();. aber als ich das eingesetzt hatte, hatte die Funkton nicht mehr funktioniert :(

Hat jemand Erfahrungen mit dem Problem?

Ciao

Thomas

  1. kann mir nicht vorstellen, das du den header separat schreiben kannst. nur document.write() geht auch, aber die normalform wäre:
    1. document.open();
    2. document.write("...");
    3. doucment.close();
    also wie bei einem Dateischreiben etc. Damit schreibst du den Documenteninhalt nur. Vielleicht gibt es im Bereich DOM-Architetur noch Methoden um den Header bzw die Stylesheetsource - Angabe zu ersetzten.

  2. Hi,

    Sobald die Funktion geladen wird, wird der restliche Quelltext durch den Part ersetzt, der in docuent.write() steht. Aber ich will doch nur das im Head stehen haben.

    wann rufst Du die Funktion denn auf? Wenn das geschieht, nachdem der Head schon passé ist, existiert nicht mehr der Hauch einer Chance, diesen durch ein document.write() zu verändern. Was gerendert wurde, wurde gerendert.

    Das ist auch der Grund, weshalb alles ersetzt wird: Offenbar ist bereits das ganze Dokument fertig gerendert; d.h. es macht auch keinen Sinn mehr, etwas dorthin zu schreiben, wo es hingeschrieben werden müsste: ans Ende, hinter </html>. Drum wird alles ersetzt.

    Fazit: Rufe die Funktion zum richtigen Zeitpunkt auf. Oder verzichte gleich auf eine Funktion und schreibe direkt.

    da stht was von document.open(); und document.close();. aber als ich das eingesetzt hatte, hatte die Funkton nicht mehr funktioniert :(

    Das ist keine Fehlerbeschreibung.

    Übrigens: Das navigator-Objekt ist neben window.screen die wohl nutzfreieste Information, auf die Du mit JavaScript zugreifen kannst. Bei Dir wird u.U. auch ein Opera oder wer-weiß-was-noch-alles das Netscape-4-StyleSheet erhalten.

    Cheatah

    1. danke!

      ahm, hier is mal der richtige quelltext:


      <html>

      <head>
      <link rel="stylesheet" href="style2.css2" taype="text/css">
      <script type="text/javascript">
      function set_style() {
        if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0,1)) == "4"))
         document.open(); document.write('<link rel="stylesheet" href="style2.css" type="text/css">'); document.close();
        else document.open(); document.write('<link rel="stylesheet" href="style.css" type="text/css">'); document.close();
       }
      </script>
      </head>

      <body bgcolor=CB6526 leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="set_style();"> ...


      also wird die function doch beim laden er seite aufgerufen und somit bevor das alles "gerendert" ist, oder verstehe ich das falsch?

      bzgl. der browser die sich als netscape4 identifizieren: hmm, aber anders gehts nicht. habe zu spät daran gedacht dass netscape 4 divs nich per css positionieren kann, und habe keine lust die ganze homepage neu zu schreben, sind mittlerweile um die 400 dateien. das dauert mir zu lange. aber danke für den hinweis...

      1. Hallo,

        <body bgcolor=CB6526 leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="set_style();"> ...

        das onload-Event wird ausgelöst, nachdem alles geladen wurde.
        Also speziell in Deinem Fall: lange nachdem der head abgearbeitet wurde.

        Andreas

      2. Hallo,

        also, dass das Ganze so nicht funktionieren ***kann***, sieht man schon ganz formal daran, dass du dem Browser gar keine Angabe machst, wohin mit "document.write" dein HTML-Schnipsel geschrieben werden soll, nämlich mitten rein in den Text, an eine Stelle, die du für dich behalten hast.
        Du kannst an die richtige Stelle

        <div   id  ="HTML1"></div>
                <layer name="HTML2" top="..." left="..."></layer>

        schreiben und dann genau dort mit JavaScript etwas hineinschreiben:

        var ExtraHTML="..."

        if (document.all) {
              document.all("HTML1").innerHTML=ExtraHTML
            }
            else
            if (document.getElementById) {
              document.getElementById("HTML1").innerHTML=ExtraHTML
            }
            else
            if (document.layers) {
              with(document.HTML2.document)
                {write(ExtraHTML); close()}
            }
            ...

        Hab es aber nur mit Code für "body" ausprobiert, um Bilder einzusetzen. In <div> wird der Code unittelbar eingefügt, <layer> funktioniert anders, da muß man sich einlesen.

        Gruß
        Hans35

        1. danke!!!

          aber der <link>-tag is doch im header.. da kann ich ja schlecht divs reinsetzen, oder?

          gruß,

          thomas

          1. Hallo,

            aber der <link>-tag is doch im header.. da kann ich ja schlecht divs reinsetzen, oder?

            Weiß ich nicht, aber falls ja, dann ist mit diesen Sprachelementen nichts zu machen. Der Browser wird sich jedenfalls nicht als Hellseher betätigen, um zu erfahren, wo der Code hingeschrieben werden soll.

            Ein Alternative weiß ich aber leider nicht. Trotzdem viel Erfog!

            Gruß
            Hans35

            1. Danke! ;)

              Ciao,

              Thomas

      3. Hallo!
        Laß die Funktion weg. Falsch:

        function set_style() {
          if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0,1)) == "4"))
           document.open(); document.write('<link rel="stylesheet" href="style2.css" type="text/css">'); document.close();
          else document.open(); document.write('<link rel="stylesheet" href="style.css" type="text/css">'); document.close();
        }

        Richtig:
           if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0,1)) == "4"))
            document.open(); document.write('<link rel="stylesheet" href="style2.css" type="text/css">'); document.close();
           else document.open(); document.write('<link rel="stylesheet" href="style.css" type="text/css">'); document.close();

        OK, hab's nicht ausprobiert, sollte aber klappen.

      4. Hallo Thomas,

        ahm, hier is mal der richtige quelltext:


        <html>

        <head>
        <link rel="stylesheet" href="style2.css2" taype="text/css">
        <script type="text/javascript">
        function set_style() {
          if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0,1)) == "4"))
           document.open(); document.write('<link rel="stylesheet" href="style2.css" type="text/css">'); document.close();
          else document.open(); document.write('<link rel="stylesheet" href="style.css" type="text/css">'); document.close();
        }
        </script>
        </head>

        <body bgcolor=CB6526 leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="set_style();"> ...


        also wird die function doch beim laden er seite aufgerufen und somit bevor das alles "gerendert" ist, oder verstehe ich das falsch?

        warum schreibst du das ganze überhaupt in ne Funktion? Du kannst doch direkt im Head-bereich dein script - document.write unterbringen, spätestens dann kannst du auch den ganzen open/close Kram loswerden, dessen sinn ich eh nicht verstehe.

        Dann fehlt dir mindestens ein Satz geschweifte Klammern, im if-Zweig hast du zwei anweisungen untergebracht und spätestens dann musst du klammern.

        Abgesehen davon würde ich den else-Zweig weglassen und das Stylesheet für 'vernünftige' browser regulär in den Code schreiben. Dabei kannst du Netscape 4 mit @import oder media="all" ausschliessen. Das hat den Vorteil, dass die javascript-Abhängigkeit nur bei NN4 besteht - und der kann ohne Javascript eh kein CSS - und für alle anderen die Formatierung nicht vom aktivierten JavaScript abhängig ist.

        Gruß Susanne

        1. Abgesehen davon würde ich den else-Zweig weglassen und das Stylesheet für 'vernünftige' browser regulär in den Code schreiben. Dabei kannst du Netscape 4 mit @import oder media="all" ausschliessen. Das hat den Vorteil, dass die javascript-Abhängigkeit nur bei NN4 besteht - und der kann ohne Javascript eh kein CSS - und für alle anderen die Formatierung nicht vom aktivierten JavaScript abhängig ist.

          das verstehe ich nicht. könntest du darauf vielleicht noch mal kurz eingehen? danke!

          Thomas

          1. Abgesehen davon würde ich den else-Zweig weglassen und das Stylesheet für 'vernünftige' browser regulär in den Code schreiben. Dabei kannst du Netscape 4 mit @import oder media="all" ausschliessen. Das hat den Vorteil, dass die javascript-Abhängigkeit nur bei NN4 besteht - und der kann ohne Javascript eh kein CSS - und für alle anderen die Formatierung nicht vom aktivierten JavaScript abhängig ist.

            das verstehe ich nicht. könntest du darauf vielleicht noch mal kurz eingehen? danke!

            Es gibt ein paar Hacks, die Netscape 4 davon abhalten sich an CSS, das seine Fähigkeiten übersteigt, überhaupt erst zu versuchen.
            Dazu gehören die Einbindung der CSS Datei mit "@import(url)" und die Angabe media="all" bzw. media="screen" im link rel Bereich. Dt. Quelle habe ich grade nicht zur Hand. Wenns auch englisch sein darf schau mal unter http://www.richinstyle.com/masterclass/crossbrowser.html#netscape
            Die reduzierte/spezialisierte CSS-Datei für Netscape 4 lädst du dann per javascript nach.

            war das die Frage?
            Gruß Susanne

            1. ja, das war die frage. aber das ist zu hoch für mich... aber verdammt interessant!!

              obwohl...das heißt: ich will meine objekte positionieren. dann gebe ich für "richtige brwoser" ;) die positionierung an, und für netscae mache ich die mit !important versteckt. dann kommts richtig? ich versuchs mal, ich glaub das ist die lösung!

              Super, daaaanke!!!!

              Ciao

              Thomas

              1. Hi Thomas,

                ja, das war die frage. aber das ist zu hoch für mich... aber verdammt interessant!!

                das ist die beste Voraussetzung, um etwas zu lernen ;)

                obwohl...das heißt: ich will meine objekte positionieren. dann gebe ich für "richtige brwoser" ;) die positionierung an, und für netscae mache ich die mit !important versteckt. dann kommts richtig? ich versuchs mal, ich glaub das ist die lösung!

                Sven hat dich ja schon auf http://aktuell.de.selfhtml.org/tippstricks/css/browserweiche/ hingewiesen. Du definierst zunächst alles, was Netscape 4 nicht durcheinanderwürfelt und im Bereich von "@media" alles weitere, das er nicht kann oder falsch macht. Du kannst natürlich auch zwei verschiedene Stylesheets einbinden, und darin obige Aufteilung vornehmen. Das Stylesheet mit den komplexeren Angaben verstecktst du einfach vor ihm. Javascript ist bei deinem Vorhaben absolut nicht nötig.

                LG Orlando

                --
                SELF-TREFFEN 2002
                http://www.rtbg.de/selftreffen/
                http://www.megpalffy.org/temp/penneninhh.html

                1. Hi du!

                  Sven hat dich ja schon auf http://aktuell.de.selfhtml.org/tippstricks/css/browserweiche/ hingewiesen. Du definierst zunächst alles, was Netscape 4 nicht durcheinanderwürfelt und im Bereich von "@media" alles weitere, das er nicht kann oder falsch macht. Du kannst natürlich auch zwei verschiedene Stylesheets einbinden, und darin obige Aufteilung vornehmen. Das Stylesheet mit den komplexeren Angaben verstecktst du einfach vor ihm. Javascript ist bei deinem Vorhaben absolut nicht nötig.

                  Ich habe ja für Netscape 4 die style2.css und für IE die style.css erstellt. Der Head der Datei sieht mittlerweile so aus:

                  ----

                  <head>
                  <link rel="stylesheet" href="style2.css" type="text/css">
                  <style type="text/css">
                  @import url(style.css) all;
                  </style>
                  </head>

                  ----

                  Am Mac funktionirt es jetzt wunderbar: NC nimmt wegen <link> die style2.css, IE wegen @import die style.css. Am PC sieht die Sache wieder anders aus.
                  Netscape 4 nimmt style2.css - richtig!
                  Netscape 6 nimmt style.css - auch richtig!
                  Opera sieht auch gut aus!
                  ABER: Explorer nimmt plötzlich auch die style.css und hat deshalb ein miserables Ergebnis.

                  Woran liegt das jetzt? Ich denk IE kann @import? Hmm... also so funktioniert das auch nicht.

                  Hat noch jemand ne Idee? Ich wäre unheimlich dankbar!

                  Ciao

                  Thomas

                  1. Moin!

                    Am Mac funktionirt es jetzt wunderbar: NC nimmt wegen <link> die style2.css, IE wegen @import die style.css. Am PC sieht die Sache wieder anders aus.
                    Netscape 4 nimmt style2.css - richtig!
                    Netscape 6 nimmt style.css - auch richtig!
                    Opera sieht auch gut aus!
                    ABER: Explorer nimmt plötzlich auch die style.css und hat deshalb ein miserables Ergebnis.

                    Welcher Explorer? Beispiel-Link?

                    Hast du bedacht, daß bei den guten Browsern beide Stylesheetdateien wirksam sind, und die Angaben der style2.css durch die Angaben der style.css überschrieben werden (womit sich notwendige Abweichungen für Netscape 4 wieder rückgängig machen lassen, bzw. sogar gemacht werden müssen, wenn sie sonst unerwünscht sind).

                    - Sven Rautenberg

      5. Moin!

        Wie man den Netscape 4 mit einem angepaßten Stylesheet versorgt, steht in den Tipps&Tricks von SelfHTML unter dem Stichwort "Browserweiche" im CSS-Teil:
        http://aktuell.de.selfhtml.org/tippstricks/

        also wird die function doch beim laden er seite aufgerufen und somit bevor das alles "gerendert" ist, oder verstehe ich das falsch?

        Wenn onload aufgerufen wird, ist die Seite komplett fertig: Alle Bilder sind geladen, alle Stylesheets, alle Javascripte, das Rendering ist abgeschlossen, die Seite wird im Browser fertig angezeigt. Das ist ein Moment, in dem dein Stylesheet garantiert nicht mehr beachtet wird.

        bzgl. der browser die sich als netscape4 identifizieren: hmm, aber anders gehts nicht. habe zu spät daran gedacht dass netscape 4 divs nich per css positionieren kann, und habe keine lust die ganze homepage neu zu schreben, sind mittlerweile um die 400 dateien. das dauert mir zu lange. aber danke für den hinweis...

        Diese Information ist falsch. Netscape 4 kann prima mit CSS Layer positionieren. Dazu muß man nicht einmal mit <layer> arbeiten, mit <div> funktioniert es genausogut. Der einzige Unterschied ist nur, daß Netscape 4 diese Layer etwas mangelhaft mit Farbe und Rahmen ausstattet - es sieht also nicht unbedingt schön aus, aber im Prinzip (und mit viel Grafik) kann man damit arbeiten.

        Du hast also drei Möglichkeiten: Entweder das Stylesheet dynamisch mit Javascript einzubauen (frage dann aber besser ab, ob der Browser document.layers versteht: Das ist das eindeutigste Kennzeichen, es mit einem echten Netscape 4 zu tun zu haben). Oder du benutzt CSS-Methoden für die Browserweiche. Oder du arbeitest dein CSS noch einmal so um, daß der Netscape 4 die positionierten DIVs auch versteht. Dabei ist unbedingt notwendig, 100% exaktes CSS zu verwenden (validieren lassen!), sonst klappts nicht.

        - Sven Rautenberg

        1. Diese Information ist falsch. Netscape 4 kann prima mit CSS Layer positionieren. Dazu muß man nicht einmal mit <layer> arbeiten, mit <div> funktioniert es genausogut. Der einzige Unterschied ist nur, daß Netscape 4 diese Layer etwas mangelhaft mit Farbe und Rahmen ausstattet - es sieht also nicht unbedingt schön aus, aber im Prinzip (und mit viel Grafik) kann man damit arbeiten.

          das war keine info die ich bekommen habe, das war eine bitterliche fetstellung...

          ich habe die divs positioniert, und netscape 4 am mac zeigt sie da an wo er gerade lustig ist. also habe ich die layers in html positioniert, darin die divs. jetzt habe ich fr netscape alle dateien kopiert, und überall den verweis auf style2.css gemacht. da sind dann keine positionierungen mehr für die divs drinne, wohl aer für farben und schrift. wunderbar, es sieht überall gleich aus. nur update kann man so vergessen, weil es von jeder datei 3 versionen gibt... :(

          wie positioniere ich layer denn dann? und wie mache ich, dass die divs (die brauch ich ja auch auf jeden fall für ie) dann nicht innerhalb der layers positioniert werden? so:

          <layer style="position:absolute;top:30px;left:40px;">
          <div style="position:absolute;top:30px;left:40px;">
          text

          </div>
          </layer>

          richtig? so hats eben nicht funktioniert... :(

          haste noch nen plan?

          danke für den verweis auf tipps&tricks..

          ciao

          thomas

          1. Moin!

            das war keine info die ich bekommen habe, das war eine bitterliche fetstellung...

            Hm, kann ich mir irgendwie nur dadurch erklären, daß du einen dummen, winzigen, kaum sichtbaren Fehler im CSS gemacht hast.

            BTW: Welche Version des Netscape denn? Die ganz alten sind AFAIK noch etwas fehlerträchtiger als die neueren (so ab Version 4.5/4.7).

            ich habe die divs positioniert, und netscape 4 am mac zeigt sie da an wo er gerade lustig ist. also habe ich die layers in html positioniert, darin die divs. jetzt habe ich fr netscape alle dateien kopiert, und überall den verweis auf style2.css gemacht. da sind dann keine positionierungen mehr für die divs drinne, wohl aer für farben und schrift. wunderbar, es sieht überall gleich aus. nur update kann man so vergessen, weil es von jeder datei 3 versionen gibt... :(

            ...was ja nicht Sinn der Sache sein kann. :)

            wie positioniere ich layer denn dann? und wie mache ich, dass die divs (die brauch ich ja auch auf jeden fall für ie) dann nicht innerhalb der layers positioniert werden? so:

            <layer style="position:absolute;top:30px;left:40px;">
            <div style="position:absolute;top:30px;left:40px;">
            text

            </div>
            </layer>

            richtig? so hats eben nicht funktioniert... :(

            Komisch. Bei mir funktioniert sowas eigentlich immer. Und ich habe schon einige heftigst positionierte Seiten gemacht, welche einfach nur mit <div> funktionieren, ohne <layer>. Auch im Netscape 4/Mac. Könnte natürlich sein, daß diese Doppelpositionierung im Netscape 4 schreckliche Auswirkungen hat.

            Konkret bei deiner Seite kann ich nur helfen, wenn Quelltext da ist. Netscape 4 sollte bei Positionierungen jedenfalls keine Probleme kriegen, die kriegt er (leider) meist ganz woanders.

            - Sven Rautenberg

            1. Hi Sven!

              tut mir leid, aber quelltext würde den rahmen sprengen...

              obwohl: http://www.fotoocom.de/mayersche/

              da liegen ordner

              html >> alle browser (stylesheet datei style.css enthält angaben 'position:absolute;')
              html2 >> netscape (stylesheet datei style.css enthält keine angaben zu 'position')
              html3 >> is ersmal unwichtig...

              oki?

              Danke!

              1. Moin!

                obwohl: http://www.fotoocom.de/mayersche/

                da liegen ordner

                html >> alle browser (stylesheet datei style.css enthält angaben 'position:absolute;')

                Du hast tausend Fehler in dieser CSS-Datei, und Netscape tickt zu Recht aus.

                Im einzelnen:

                1.) Farbangaben in Hexadezimalschreibweise erfordern zuerst das Doppelkreuz!  Nicht "ffffff" sondern "#ffffff".

                2.) Klassen- und ID-Namen dürfen KEINEN Unterstrich enthalten. Deswegen erkennt Netscape deine ganzen IDs wie "#scan_books" oder "#scan_left" nicht. Logischerweise geht dann die Positionierung verloren.

                3.) Wenn du Schriftfamilien definierst, gib als letzte Variante eine der generischen Angaben an: serif, sans-serif, monospace, fantasy oder cursive. Dann kann der Browser aus seiner eigenen Definition eine passende Schriftart nehmen, wenn keine der angegebenen Fonts installiert ist.

                Das niederschmetternde Testergebnis:

                http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.fotocom.de%2Fmayersche%2Fhtml%2Fstyle.css&warning=1&profile=css2

                html2 >> netscape (stylesheet datei style.css enthält keine angaben zu 'position')
                html3 >> is ersmal unwichtig...

                Behebe die Fehler, und du wirst diese Alternativen eher nicht brauchen.

                - Sven Rautenberg

  3. HAT SICH ERLEDIGT...

    ... Fazit:

    Wenn jemand das gleiche Problem hat, undzwar dass Netscape 4.x bestimmte CSS-Befehle nicht annehmen, bei mir lag es an folgender Sache: ich habe unterstriche in den stylesheets verwendet. das darf man bei netscape anscheinend nicht.

    deshalb erledigt sich die frage, wie man in den header reinschreibt welche style-datei verwendet werden soll, da netscape css doch ein wenig kann.

    danke an alle...

    ciao, Thomas