Anatol: Internet Explorer: firstChild is null or not an object

Hi Forum,

Ich habe ein kleines Problem mit dem Internet Explorer. Ich moechte mit Javascript den Inhalt eines <style> tags ersetzen. Der Javascript Code ist ziemlich einfach:

--------------------------------------------------

function update_css(input) {  
 document.getElementsByTagName("style")[0].firstChild.data = '<!--'+input+'-->';  
}

--------------------------------------------------

Wie immer funktioniert das auch gut in Firefox, Google Chrome und Safari. Und wie immer bereitet der Internet Explorer Probleme. Dort bekomme ich die Fehlermeldung:

'document.getElementByTagName(...).0.firstChild' is null or not an object

Die alternative Schreibweise mit
document.getElementsByTagName("style").item(0).firstChild.data
fuehrt zum selben Resultat.

Hier ist ein HTML Beispiel, das in Firefox etc... aber nicht in IE funktioniert:

--------------------------------------------------

<?xml version="1.0" encoding="UTF-8"?>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" dir="ltr">  
 <head>  
  <title>Test</title>  
  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />  
  <script src="test.js" type="text/javascript"></script>  
  <style type="text/css"><!-- --></style>  
 </head>  
 <body>  
  <div>  
   <textarea id="editor_1" rows="8" cols="80" onchange="update_css(this.value);">h1 {  
 color: #ff0000;  
}</textarea>  
  </div>  
  <h1>Test sample</h1>  
  <p>Test paragraph</p>  
 </body>  
</html>

--------------------------------------------------

In diesem Fall wird das CSS im Textfeld auf die HTML-Seite angewendet.

Falls irgendjemand einen Weg kennt oder eine Idee hat, dies auch im IE zu ermoeglichen waere ich sehr dankbar.

Schoene Gruesse!
Anatol

  1. Der IE packt immer Leerzeichen zwischen die Tags. Versuche, statt firstChild lieber getElementsByTagName.

    Gruß, LX

    --
    X-Self-Code: sh:( fo:) ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: Unusual
    X-Please-Search-Archive-First: Absolutely Yes
    1. Der IE packt immer Leerzeichen zwischen die Tags. Versuche, statt firstChild lieber getElementsByTagName.

      Hi LX und Joachim,

      Danke fuer die schnelle Antwort. Mir ist leider nicht klar, was eine bessere Loesung waere. Ich habe einige Varianten versucht, aber leider erfolglos.

        
      document.getElementsByTagName("style")[0].childNodes[0].data = '<!--'+input+'-->';
      

      ist natuerlich dasselbe wie firstChild.

      Auch weiteres Experimentieren mit getElementsByTagName hat keine besseren Ergebnisse gebracht.

      Ich bin dankbar fuer jede Hilfe.

      Liebe Gruesse,
      Anatol

      1. Hi,

        hast du mal

          
        document.getElementsByTagName("style")[0].innerHTML = '<!--'+input+'-->';
        

        ausprobiert?

        gruß
        peter

        1. [latex]Mae  govannen![/latex]

          document.getElementsByTagName("style")[0].innerHTML = '<!--'+input+'-->';

          
          >   
          > ausprobiert?  
            
          Bin ich eigentlich der Einzige, der sich fragt, was `<!-- irgendwas -->`{:.language-html} in einem `style`{:.language-html}-Element verloren hat?  
            
          Cü,  
            
          Kai
          
          -- 
          Ash nazg durbatulûk, ash nazg gimbatul,ash nazg thrakatulûk, agh burzum-ishi krimpatul  
            
          selfcode sh:( fo:| ch:? rl:( br:< n4:# ie:{ mo:| va:) js:) de:> zu:) fl:( ss:| ls:?  
          [Mein Selfhtml-Kram](http://www.kaichen.in/selfhtml/)
          
          1. Hi

            Bin ich eigentlich der Einzige, der sich fragt, was <!-- irgendwas --> in einem style-Element verloren hat?

            Vielleicht weil sonst keiner auf die Idee gekommen ist, der Funktion den String ' irgendwas ' zu übergeben ?

            gruß
            peter

        2. Hi,

          hast du mal

          document.getElementsByTagName("style")[0].innerHTML = '<!--'+input+'-->';

          
          >   
          > ausprobiert?  
            
            
          habs mal ausprobiert mit dem innerHTML.  
          Da bringt mein ScriptDebugger für den IE "unbekannter Laufzeitfehler".  
            
          Ein `alert(document.getElementsByTagName("style")[0].innerHTML);`{:.language-javascript} zeigt mir ordentlich genau das an, was drinsteht.  
          Aber wenn ich neu reinschreiben will kommt der "unbekannte Laufzeitfehler". Passiert auch, wenn ich per JS ein neues STYLE-Element erzeuge und dem dann innnerHTML zuweisen will.  
            
          Der FF machts alles ohne Probleme.  
          Im Opera gehts auch, Safari nicht.  
            
          gruß  
          peter
          
          1. Der FF machts alles ohne Probleme.
            Im Opera gehts auch, Safari nicht.

            Was willst du eigentlich erreichen?

            Struppi.

            1. Hi,

              Was willst du eigentlich erreichen?

              Nichts. Mich hat einfach nur mal interessiert, ob das was Anatol erreichen will, vielleicht mit innerHTML machbar ist. Isses wohl nicht, ChrisB hat den entscheidenden Link dazu gepostet.

              gruß
              peter

          2. Hi,

            habs mal ausprobiert mit dem innerHTML.
            Da bringt mein ScriptDebugger für den IE "unbekannter Laufzeitfehler".

            Ein alert(document.getElementsByTagName("style")[0].innerHTML); zeigt mir ordentlich genau das an, was drinsteht.
            Aber wenn ich neu reinschreiben will kommt der "unbekannte Laufzeitfehler". Passiert auch, wenn ich per JS ein neues STYLE-Element erzeuge und dem dann innnerHTML zuweisen will.

            Ist ja auch gar kein Wunder, da innerHTML von Microsoft u.a. fuer Style-Elemente als read-only definiert ist.

            MfG ChrisB

            --
            „This is the author's opinion, not necessarily that of Starbucks.“
            1. Hi,

              Ist ja auch gar kein Wunder, da innerHTML von Microsoft u.a. fuer Style-Elemente als read-only definiert ist.

              Vielen Dank für den Link. Alles klar.

              gruß
              peter

    2. Hallo,

      Versuche, statt firstChild lieber getElementsByTagName.

      da dürfte das Problem darin liegen, dass das style-Element ja gar keine Kindelemente hat, sondern nur Textknoten.
      Und ich könnte mir vorstellen, dass der IE sogar diese Textknoten noch verleugnet, weil das style-Element ja eine besondere Bedeutung hat.

      So long,
       Martin

      --
      Rizinus hat sich angeblich als sehr gutes Mittel gegen Husten bewährt.
  2. Hi,

    document.getElementsByTagName("style")[0].firstChild.data = '

    keine gute Idee, denn wer das erste Kind ist wird unterschiedlich interpretiert. Umbrüche zählen z.B. für iE dazu.

    Gruesse, Joachim

    --
    Am Ende wird alles gut.