Zum Inhalt springen
View in the app

A better way to browse. Learn more.

Fachinformatiker.de

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

DOM- Manipulation mit Javascript

Empfohlene Antworten

Veröffentlicht

Hi,

ich versuch gerade mit Javascript den folgenden Html-Code


<div class="form">

    <table>

        <tr>

            <td><img src="img/form.topleft.png" style="width:5px; height:30px;" alt="" /></td>

            <td><img src="img/form.top.png" style="width:900px; height:30px;" alt="" /></td>

            <td><img src="img/form.topright.png" style="width:5px; height:30px;" alt="" /></td>

        </tr>

        <tr>

            <td><img src="img/form.left.png" style="width:5px; height:700px;" alt="" /></td>

            <td><img src="img/form.bkgnd.png" style="width:900px; height:700px;" alt="" /></td>

            <td><img src="img/form.right.png" style="width:5px; height:700px;" alt="" /></td>

        </tr>

        <tr>

            <td><img src="img/form.bottomleft.png" style="width:5; height:35px;" alt="" /></td>

            <td><img src="img/form.bottom.png" style="width:900px; height:35px;" alt="" /></td>

            <td><img src="img/form.bottomright.png" style="width:5px; height:35px;" alt="" /></td>

        </tr>

    </table>

</div>

in ein bestehendes Dokument einzufügen. Mein jetziger Code ist der Folgende:

var a = new Array();

a[0] = new Array();

a[0][0] = new Array("img/form.topleft.png", "5px", "30px");

a[0][1] = new Array("img/form.top.png", cx + "px", "30px");

a[0][2] = new Array("img/form.topright.png", "5px", "30px");

a[1] = new Array();

a[1][0] = new Array("img/form.left.png", "5px", cy + "px");

a[1][1] = new Array("img/form.bkgnd.png", cx + "px", cy + "px");

a[1][2] = new Array("img/form.right.png", "5px", cy + "px");

a[2] = new Array();

a[2][0] = new Array("img/form.bottomleft.png", "5px", "35px");

a[2][1] = new Array("img/form.bottom.png", cx + "px", "35px");

a[2][2] = new Array("img/form.bottomright.png", "5px", "35px");


var tbl = document.createElement("table");

for(var i = 0; i < 3; i++) {

    var tr = document.createElement("tr");

    tbl.appendChild(tr);

    for(var k = 0; k < 3; k++) {

        var td = document.createElement("td");

        var img = document.createElement("img");

        img.setAttribute("src", a[i][k][0]);

        img.setAttribute("style", "width:" + a[i][k][1] + "; height:" + a[i][k][2] + ";");

        td.appendChild(img);

        tr.appendChild(td);

    }

}

var div = document.createElement("div");

div.setAttribute("class", "form");

div.appendChild(tbl);

document.getElementsByTagName("body")[0].appendChild(div);

Das ganze läuft unter Firefox auch einwandfrei. Unter IE 7 aber nicht. Und genau da liegt mein Problem. Ist irgendwas an meinem Code falsch, fehlt etwas oder liegt das an einer Einstellung im IE?

Das ganze läuft unter Firefox auch einwandfrei. Unter IE 7 aber nicht. Und genau da liegt mein Problem. Ist irgendwas an meinem Code falsch, fehlt etwas oder liegt das an einer Einstellung im IE?

Beim IE musst du AFAIR die Tabelle falschrum aufbauen, sprich von innen anfangen. Die TDs hängst du erst an das TR, dann hängst du das TR an den TableBody.

Hier mal ein Auszug aus der entspr. Funktion von mir:



  // Grundelemente der Tabelle erzeugen

  var myTable = document.createElement("TABLE");

  var myTableBody = document.createElement("TBODY");

  var myTableHead = document.createElement("THEAD");

...

  var myHeader = document.createElement("TR");

...

  myCell = document.createElement("TH");

  myCell.appendChild(document.createTextNode(arHeader[i]));

  myHeader.appendChild(myCell);

...

  myTableHead.appendChild(myHeader);

  myTable.appendChild(myTableHead);

...

  myRow = document.createElement("TR");

...

  var myCell = document.createElement("TD");

...

  myCell.appendChild(document.createTextNode(myContent));

...

  myRow.appendChild(myCell);

...

  myTableBody.appendChild(myRow);

...

  myTable.appendChild(myTableBody);

Das ganze war eine funktion, die aus übergebenen Arrays eine Tabelle aufgebaut hat (deswegen ist es was zerstückelt, aber auch nur die entscheidenden Teile).

Das funktioniert sorum auch im FF/Oopera (umgekehrt aber nicht im IE)

Jo, super läuft.

...

Wäre ja auch langweilig, wenn man sich mal auf Standards einigen und auch noch daran halten würde.

Archiv

Dieses Thema wurde archiviert und kann nicht mehr beantwortet werden.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.