1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen
  2. Unsere jährliche Weihnachts-Banner-Aktion hat begonnen! Wir freuen uns auf viele, viele kreative Vorschläge.
    Mehr dazu könnt Ihr hier nachlesen: Weihnachtsbanner 2016

    Information ausblenden

[JavaScript] Reihenfolge beim ausführen von document.write

Dieses Thema im Forum "Web-Programmierung" wurde erstellt von Alecco, 26.01.10.

  1. Alecco

    Alecco Transparent von Croncels

    Dabei seit:
    17.02.09
    Beiträge:
    306
    Hi,

    ich wundere mich grade über folgendes: Ich erzeuge mit einer Schleife und einem Array Eingabefelder. Das klappt auch alles. Jetzt möchte ich das gerne in eine Tabelle schreiben. Komisch ist, dass die Tabelle nicht erzeugt wird.

    Dazu folgender Ausschnitt aus meinem Code:

    Code:
    ...
    document.write("<table id='1' width='' border='1' cellspacing='1'>");    
        for(i=0; i<feingabe.length; i++){
            document.write("<tr>");
            document.write("<td><strong><font class='sd'>"+ feingabe[i] +"</font></strong></td>");
            document.write("<td><input type='text' name="+ feingabe[i] +"size='35' style='background-color:#FFFCF2; border:1px solid; border-color:#AAAAAA; font-size:8pt; width:250px' value=''></td>");
            document.write("</tr>");
        }    
        document.write("</table>");
    
    Jetzt passiert folgendes:
    Anstatt das er etwas macht wie...
    Code:
    <table...>
    ...
    </table>
    
    macht er:

    Code:
    <table...></table>
    ...
    
    Woher kommt das?
     
  2. knalli

    knalli Stechapfel

    Dabei seit:
    19.01.10
    Beiträge:
    159
    Laut Schleife sollte das zwar gehen.. aber du solltest, ganz im Ernst, von document.write Abstand nehmen. Abgesehen vom Laufzeitverhalten ist das unschön.

    Sagen wir, du willst in einem DIV (sagen wir, <div id="meindiv">..) eine Tabelle wie oben einfügen, und willst dafür ernsthaft kein Hilfsmittel wie jQuery nutzen:

    Code:
    var target = document.getElementById('meindiv'); // unchecked if exists
    
    var table = document.createElement('table');
    table.id = 1;
    table.border = 1;
    table.cellspacing = 1;
    
    for (var i = 0; i < feingabe.length; i++) {
      var text = feingabe[i];
      var tr = document.createElement('tr');
      var td1 = document.createElement('td');
      var td2 = document.createElement('td');
      var input = document.createElement('input');
    
      td1.innerHTML = text; // oder td1.appendChild(document.createTextNode(text));
      
      input.type = 'text';
      input.name = text;
      input.size = 35;
      input.style.backgroundColor = '#ffcf2'; // usw.
      td2.appendChild(input);
     
    
      tr.appendChild(td1);
      tr.appendChild(td2);
      table.appendChild(tr);
    }
    
    target.appendChild(table);
    

    Das ist echte DOM-Manipulation auf den Baum und hat auf jeden Fall den gewünschten Effekt. Da da allerdings viel Boilercode ist, würde ich ein Framework wie jQuery empfehlen. Einfach mal angucken, jquery.com. Angenehm, leicht, kurz, klein und schnell.
     
  3. Alecco

    Alecco Transparent von Croncels

    Dabei seit:
    17.02.09
    Beiträge:
    306
    Ok ich habe alles umgeändert und es funktioniert.

    Aber: Wie kann ich jetzt z.B. bei einem erzeugtem "radio" überprüfen, ob dieser angeklickt worden ist?
     
  4. knalli

    knalli Stechapfel

    Dabei seit:
    19.01.10
    Beiträge:
    159

Diese Seite empfehlen