Sally: HTML Tabelle mit Javascript function generieren?

Hallo - ich suche einen Javascript Experten der mir weiterhelfen kann!

Wie schreibe ich mit Javascript eine function die mir diese Tabelle ausgibt? Könntet Ihr mir ein beispiel erstellen... wär echt super!!!

Der HTML CODE sieht so aus:

<body>

<table>
<tr>
<td><img src="0.jpg" id="" /></td>
<td><img src="1" id="" /></td>
<td><img src="2" id="" /></td>
<td><img src="3" id="" /></td>
</tr>

<tr>
<td><img src="4" id="" /></td>
<td><img src="5" id="" /></td>
<td><img src="6" id="" /></td>
<td><img src="7" id="" /></td>
</tr>

<tr>
<td><img src="8" id="" /></td>
<td><img src="9" id="" /></td>
<td><img src="10" id="" /></td>
<td><img src="11" id="" /></td>
</tr>

<tr>
<td><img src="12" id="" /></td>
<td><img src="13" id="" /></td>
<td><img src="14" id="" /></td>
<td><img src="blank.jpg" id="" /></td>
</tr>

Ist es möglich diese Javascript function so zu schreiben das verschiedene formate möglich wären z.B. 2x2, 3x3 und natürlich wie oben in HTML die 4x4

MFG
Sally

  1. hi,

    Wie schreibe ich mit Javascript eine function die mir diese Tabelle ausgibt?

    Über die DOM-Methoden createChild/appendChild [1], ggf. in Kombination mit der tabellenspezifischen Methode insertRow.

    [1] Dabei beachten, dass der IE Tabellenzeilen explizit nur in einen TBody (oder THead/TFoot) eingehängt haben mag.

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
  2. Hallo Sally.

    Wie schreibe ich mit Javascript eine function die mir diese Tabelle ausgibt? Könntet Ihr mir ein beispiel erstellen... wär echt super!!!

    Für die Generierung der Tabelle sowie der img-Elemente bedarf es der createElement-Methode. Anwendungsbeispiele gibt es im Archiv.

    Die Generierung von Tabellenzeilen und -zellen geht mit den insertRow- und insertCell-Methoden reicht einfach von der Hand.

    Hier einmal ein kompaktes Beispiel mit einer Zeile und Zelle:

    var table = document.createElement('table');  
    var row = table.insertRow(-1);  
    var cell = row.insertCell(-1);  
      
    document.body.appendChild(table);
    

    Diese Tabelle hat zwar noch keinerlei Inhalt, aber das Prinzip sollte deutlich werden. Ein neu generiertes img-Element müsstest du hier also mit Hilfe der http://de.selfhtml.org/javascript/objekte/node.htm#append_child@title=appendChild-Methode in „cell“ einhängen.

    Ist es möglich diese Javascript function so zu schreiben das verschiedene formate möglich wären z.B. 2x2, 3x3 und natürlich wie oben in HTML die 4x4

    Wenn du die entsprechende Anzahl an Zeilen und Zellen generierst, natürlich.

    Einen schönen Samstag noch.

    Gruß, Mathias

    --
    ie:% fl:| br:< va:) ls:& fo:) rl:( n4:~ ss:) de:] js:| mo:| zu:)
    debian/rules
    1. Hier einmal ein kompaktes Beispiel mit einer Zeile und Zelle:

      var table = document.createElement('table');

      var row = table.insertRow(-1);
      var cell = row.insertCell(-1);

      document.body.appendChild(table);

      
      >   
      > Diese Tabelle hat zwar noch keinerlei Inhalt, aber das Prinzip sollte deutlich werden. Ein neu generiertes img-Element müsstest du hier also mit Hilfe der <http://de.selfhtml.org/javascript/objekte/node.htm#append_child@title=appendChild>-Methode in „cell“ einhängen.  
        
      
      > Einen schönen Samstag noch.  
      >   
      > Gruß, Mathias  
      
      »»  
        
      Hallo Mathias;  
        
      leider kann ich die beispiel tabelle nicht im browser sehen? (die eine Zeile) es würde mir sehr helfen wen, ich anhand einer function diese Tabelle generieren könnte - leider hab ich keine Ahnung wie ich diese function formulieren müsste?  
        
      also etwa so:  
      function() {  
      generiere Tabelle mit 4x4  
      }  
      
      1. hi,

        es würde mir sehr helfen wen, ich anhand einer function diese Tabelle generieren könnte - leider hab ich keine Ahnung wie ich diese function formulieren müsste?

        Dazu hast du gerade eben Tipps bekommen.
        Also zeig bitte, wie du versucht hast, diese umzusetzen.

        gruß,
        wahsaga

        --
        /voodoo.css:
        #GeorgeWBush { position:absolute; bottom:-6ft; }