Tanne: Firefox und Opera: Unterschied bei Tabellen

Hallo Selfler.

Hier haben wir eine Tabelle:

  
<table>  
   <tr id="ersteZeile">  
         <td>nummer_1</td>  
         <td>nummer_2</td>  
         <td>nummer_3</td>  
         <td>nummer_4</td>  
         <td>nummer_...</td>  
   </tr>  
</table>  

Will mich mit Javascript auf das td-Element mit dem Inhalt "nummer_1" zugreifen, dann geht das mit Firefox so:
document.getElementById("ersteZeile").secondChild.innerHTML = "irgendwas";

Bei Opera hingegen so:
document.getElementById("ersteZeile").firstChild.innerHTML = "irgendwas";

Scheinbar interpretiert Firefox den Zeilenumbruch als eigenständiges Kindelement, Opera hingegen nicht. Warum ist das so, wer hat Recht und wie gehe ich damit am besten um bzw. wie kann ich am einfachsten browserübergreifenden Code schreiben. Gibt es da schon extra Frameworks für?

Vielen Dank.

  1. Hi,

    Scheinbar interpretiert Firefox den Zeilenumbruch als eigenständiges Kindelement, Opera hingegen nicht. Warum ist das so, wer hat Recht und wie gehe ich damit am besten um bzw. wie kann ich am einfachsten browserübergreifenden Code schreiben.

    Dieser Forums-Thread sollte deine Fragen beantworten:
    http://forum.de.selfhtml.org/archiv/2008/7/t173562/#m1139755

    mfG,
    steckl

  2. Yerf!

    Scheinbar interpretiert Firefox den Zeilenumbruch als eigenständiges Kindelement, Opera hingegen nicht. Warum ist das so, wer hat Recht und wie gehe ich damit am besten um bzw. wie kann ich am einfachsten browserübergreifenden Code schreiben. Gibt es da schon extra Frameworks für?

    Wer recht hat... keine Ahnung. Aber die Problematik tritt immer wieder mal auf, auch im Zusammenhang mit dem IE.

    Das Beste ist wohl, entweder mit "falschen" Nodes zu rechnen und notfalls den nächsten zu nehmen oder aber die Kindknoten gezielt zu holen, z.B. mit getElementsByTagName.

    Gruß,

    Harlequin

    --
    <!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->
  3. [latex]Mae  govannen![/latex]

    Scheinbar interpretiert Firefox den Zeilenumbruch als eigenständiges Kindelement, Opera hingegen nicht. Warum ist das so, wer hat Recht und wie gehe ich damit am besten um bzw. wie kann ich am einfachsten browserübergreifenden Code schreiben. Gibt es da schon extra Frameworks für?

    Ist die Seite im Quirks-Modus? <vermutung typ="ungetestet">dann könnte Opera sich hier wie der IE verhalten</vermutung>
    Im „Standardkonformen Modus“ jedenfalls werden die Zeilenumbrüche auch bei Opera mitgezählt.

    Cü,

    Kai

    --
    YouTube Video-Tipp: Harmonic Curves
    YouTube Video-Tipp: Pipe Dreams
    selfcode sh:( fo:| ch:? rl:( br:< n4:# ie:{ mo:| va:) js:) de:> zu:) fl:( ss:| ls:?
  4. Lieber Tannenbaum,

    Hier haben wir eine Tabelle:

    <table>

    <tr id="ersteZeile">
             <td>nummer_1</td>
             <td>nummer_2</td>
             <td>nummer_3</td>
             <td>nummer_4</td>
             <td>nummer_...</td>
       </tr>
    </table>

    
    > mit Firefox so:  
    > document.getElementById("ersteZeile").secondChild.innerHTML = "irgendwas";  
    >   
    > Bei Opera hingegen so:  
    > document.getElementById("ersteZeile").firstChild.innerHTML = "irgendwas";  
      
    für alle Browser so:  
    `document.getElementById("ersteZeile").getElementsByTagName("td")[0].innerHTML = "gefunden!";`{:.language-javascript}  
      
    Im Übrigen würde ich diese ID nicht an das erste <tr>-Element vergeben, sondern an die Tabelle selbst. Damit kannst Du dann auch gleich eine semantisch sinnvollere ID vergeben, nämlich eine ID, die etwas über den Sinn und Zweck, oder über den Inhalt der Tabelle aussagt.  
      
    ~~~html
    <table id="ergebnisse_der_umfrage">  
        <tr>  
            <td>nummer_a_0</td>  
            <td>nummer_a_1</td>  
            <td>nummer_a_2</td>  
            <td>nummer_a_3</td>  
        </tr>  
        <tr>  
            <td>nummer_b_0</td>  
            <td>nummer_b_1</td>  
            <td>nummer_b_2</td>  
            <td>nummer_b_3</td>  
        </tr>  
    </table>
    

    Ich hole mir jetzt aus der zweiten Zeile den dritten Eintrag:

    function hole_zelleninhalt (id, zeilen_nr, spalten_nr) {  
        var tabelle = document.getElementById(id);  
        var zeile, alle_zeilen, spalte, alle_spalten;  
      
        if (tabelle) { // sicherstellen, dass Tabelle auch gefunden wurde!  
            alle_zeilen = tabelle.getElementsByTagName("tr");  
            if (zeilen_nr <= alle_zeilen.length) { // ist Zeile überhaupt vorhanden?  
                zeile = alle_zeilen[zeilen_nr -1]; // bei Null zu zählen anfangen!  
            }  
      
            if (zeile) { // sicherstellen, dass die Zeile gefunden wurde!  
                alle_spalten = zeile.getElementsByTagName("td");  
                if (spalten_nr <= alle_spalten.length) { // Spalte überhaupt vorhanden?  
                    spalte = alle_spalten[spalten_nr -1];  
                }  
            }  
        }  
      
        return (spalte ? spalte.innerHTML : "!!!Zelle nicht gefunden!!!");  
    }  
      
    alert("Inhalt: " + hole_zelleninhalt("ergebnisse_der_umfrage", 2, 3));
    

    Liebe Grüße aus Ellwangen,

    Felix Riesterer.

    --
    ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
  5. @@Tanne:

    wie kann ich am einfachsten browserübergreifenden Code schreiben.

    War das eine Frage. ;-)

    Nutze rows und cells.

    Live long and prosper,
    Gunnar

    --
    Erwebsregel 208: Manchmal ist das einzige, was gefährlicher als eine Frage ist, eine Antwort.