Insérer un tableau dans le dom avec Internet Explorer 7

Publié le 20 octobre 2010 par Martin Catty | front

Cet article est publié sous licence CC BY-NC-SA

Le problème

Avec prototype, l’insertion d’un tableau sous Internet Explorer 7 (et 6) dans le DOM de la manière ci-dessous ne fonctionne pas:

document.observe("dom:loaded", function() {
  var table = new Element("table");
  var row = new Element("tr");
  row.insert(new Element("td").update("foo"));
  row.insert(new Element("td").update("bar"));
  table.insert(row);
  $(document.body).insert(table);
});

La solution

En effet il est nécessaire de spécifier explicitement les éléments thead et tbody:

document.observe("dom:loaded", function() {
  var table = new Element("table");
  var thead = new Element("thead");
  var row = new Element("tr");
  row.insert(new Element("td").update("foo"));
  row.insert(new Element("td").update("bar"));
  thead.insert(row);
  table.insert(thead);
  $(document.body).insert(table);
});

Selon le w3c la création de ces éléments n’a pas à être explicite. Il s’agit donc (encore) d’un bug d’Internet Explorer, fixé sur IE8.