Hallo!
Ich hab jetzt wie von wahsage vorgeschlagen, mit cloneNode bzw importNode beschäftigt. Damit bin ich auch nicht wirklich weitergekommen, da einiges im IE nicht funktioniert.
In einem Forum bin auch eine andere Methode gekommen.
Hier mein neuer Code. Funktioniert im FF/Mozilla wunderbar. Nur im IE nicht. Das komische ist, dass die Tabelle im IE offenbar richtig ins DOM eingehängt wird, aber einfach nicht angezeigt wird. Der IE zeigt auch keine Fehlermeldungen.
Dh, wenn ich nach dem Einhängen document.body mit firstchild und dann mit nextSibling durchgehe, dann ist die Tabelle vorhanden.
Die style Eigenschaften der Tabelle nach dem Einfügen zu setzen (zb display, width, height, ...) nützt auch nichts.
Die Funktion myNodeCopy stammt nicht von mir, sondern habe ich von hier.
Irgendwelche Ideen warum das das im IE nicht geht?
Hier der Code:
<html>
<head>
<style text="text/css">
.test {
color: green;
}
</style>
<script type="text/javascript" src="./js/prototype.js"></script>
<script type='text/javascript'>
function myNodeCopy(oNode, bImportChildren){
var oNew;
if(oNode.nodeType == 1){
oNew = document.createElement(oNode.nodeName);
for(var i = 0; i < oNode.attributes.length; i++){
oNew.setAttribute(oNode.attributes[i].name, oNode.attributes[i].value);
}
//alert(oNew.style.cssText);
//oNew.style.cssText = oNode.style.cssText;
} else if(oNode.nodeType == 3){
oNew = document.createTextNode(oNode.nodeValue);
}
if(bImportChildren && oNode.hasChildNodes()){
for(var oChild = oNode.firstChild; oChild; oChild = oChild.nextSibling){
oNew.appendChild(myNodeCopy(oChild, true));
}
}
return oNew;
}
function getTable(){
pars='';
url='testresponse.xml';
var myAjax = new Ajax.Request(
url,
{
method: 'get',
parameters: pars,
onComplete: insertTable
});
}
function insertTable(req){
var xml=req.responseXML;
var table=xml.firstChild.firstChild; // IE liefert sofort table
if(table.nodeName!="table") // FF/Mozilla liefert zuerst noch #text
table=table.nextSibling;
var table1=myNodeCopy(table,true);
document.body.appendChild(table1);
}
</script>
</head>
<body>
<button onClick="getTable()">insert Table</button>
</body>
</html>
testresponse.xml:
<ajax-response>
<table border="1">
<tr>
<td onclick='alert("HALLO")'>Zeile 1 Spalte 1</td>
<td style='background-color: red;'>Zeile 1 Spalte 2</td>
</tr>
<tr>
<td><span>test</span></td>
<td class='test'>Zeile 2 Spalte 2</td>
</tr>
</table>
</ajax-response>
mfg
frafu