Copiez le contenu d'une table dans une autre

Question

Dans mon application actuelle, j'ai besoin de copier le contenu d'une table dans une autre ... Avec la configuration innerHTML cela fonctionne parfaitement en FF ... mais pas en IE8 ... Voici le code i utilisé pour copier dans FF:

getID("tableA").innerHTML = getID("tableB").innerHTML; 
// getID is a custom function i wrote to provide a shorter version of document.getElementById(); 

TableA est vide (seule la balise tbody existe). TableB est à la recherche comme ceci:

 

table 
    tbody 
    tr 
     td "Content" /td 
     td "Content" /td 
    /tr 
    /tbody 
/table 
 

Je l'ai déjà essayé d'utiliser nodeValue .. ou appendData ... ou outerHTML .. mais rien de vraiment travaillé ...

Answer 1

Internet Explorer ne vous permet pas de modifier l'intérieur des tables avec innerHTML - c'est tout ou rien.

Puisque vous essayez d'utiliser innerHTML pour copier les informations, une copie complète doit être en sécurité (c.-à-pas ont des attributs d'identité qui pourraient devenir dupliquée), auquel cas je ferais ceci:

var source = document.getElementById('tableA'); 
var destination = document.getElementById('tableB'); 
var copy = source.cloneNode(true); 
copy.setAttribute('id', 'tableB'); 
destination.parentNode.replaceChild(copy, destination); 

Answer 2

Je suis un peu surpris d'apprendre que cela n'a pas été réparé pour IE 8. Geez, parlez de faire glisser vos pieds. Ceci est une omission intentionnelle dans l'implémentation de innerHTML d'Internet Explorer - vous ne pouvez pas définir innerHTML dans une table. Le créateur de la fonctionnalité a proposé an explanation and a workaround. Fondamentalement, vous pouvez obtenir un nœud tbody réel et utiliser replaceChild() pour transformer le tbody de la table d'origine en cela.