Toon posts:

[js] IE brokje html omzetten mbv xslt

Pagina: 1
Acties:

Verwijderd

Topicstarter
Ik wil een brokje html omzetten in een stuk xml met behulp van xsl en javascript.

Nu kan ik voor Fx, Moz en Opera (9) gewoon de boel als xhtml serveren, met een httprequest een stylesheet inlezen en met een XSLTProcessor de boel omzetten geen enkel probleem.

Java:
1
2
3
4
5
6
7
8
9
xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", "some.xsl", false);
xmlhttp.send(null);
var xslDoc = xmlhttp.responseXML;
        
var xsl = new XSLTProcessor();
xsl.importStylesheet(xslDoc);

var G = xsl.transformToFragment(obj, document);


Nu IE
IE kan een XML document wel omzetten via het transformNode() method, maar dan moet je natuurlijk wel een XML DOM document hebben
Java:
1
XMLDOMObject.transformNode(xslDoc)


Nu kan ik best xhtml syntax serveren, maar dat moet natuurlijk als html (anders wordt heel m'n pagina sowieso al niet getoond): resultaat een HTML DOM. Deze dom bevat de method dus niet en ik kan ook niet zomaar die stukje HTML DOM appenden aan een nieuw XML Document.

Volgende idee was de outerHTML van m'n stukje html uitlezen en dat via de loadXML() method van IE weer inladen alsof het XML was. Probleem is dat de outerHTML uppercase nodes oplevert (en m'n xsl is gebaseerd op lowercase) en bovendien dat de attributen waar dat toegestaan is (in html) geen quotes hebben. Malformed xml syntax dus, dus dat gaat fout.

Nu kan ik wel een enorm arsenaal aan regexen opentrekken om die HTML code op te gaan schonen, maar ik vraag me dus af of er geen betere ideeen zijn.

Verwijderd

Ik weet niet hoe complex die DOM is en wat je er allemaal van moet hebben, maar misschien is het een goed idee om recursief over die DOM te lopen en zelf je XML-versie samen te stellen?

Verwijderd

Topicstarter
hmz, klinkt wel aardig, even ideetje uit het hoofd:

Java:
1
2
3
4
5
6
7
8
9
function cloneNodeToXML(ownerDoc, node, deep) {
  n = ownerDoc.createElement(node.nodeName);
  if (deep && node.hasChildNodes()) {
    for (var i=0; i<node.childNodes.length; i++) {
       n.appendChild(cloneNodeToXML(ownerDoc,childNodes[i],deep));
    }
  }
  return n;
}


en dan nog iets voor de attributen

/me gaat eten en dan even proberen

[ Voor 18% gewijzigd door Verwijderd op 26-02-2006 18:07 ]


Verwijderd

Topicstarter
update

Java:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function cloneNodeToXML(ownerDoc, node, deep) {
    switch (node.nodeType) {
        case 1:
            //var n = ownerDoc.createElement(node.nodeName.toLowerCase());
            var n = ownerDoc.createNode(1,node.nodeName.toLowerCase(),'http://www.w3.org/1999/xhtml');
            for (var i=0; i<node.attributes.length; i++) {
                if (node.attributes[i].specified) {
                    n.setAttribute(node.attributes[i].nodeName,node.attributes[i].nodeValue);
                }
            }
            if (deep && node.hasChildNodes()) {
                for (var i=0; i<node.childNodes.length; i++) {
                    n.appendChild(cloneNodeToXML(ownerDoc,node.childNodes[i],deep));
                }
            }
        break;
        case 3:
            var n = ownerDoc.createTextNode(node.nodeValue);
        break;
    }
    return n;
}


ik gebruik hier createNode ipv createElement omdat m'n xsl uitgaat van spul in de xhtml namespace. Die check voor attributen is omdat anders allerlei dingen meegenomen worden die de HTML parser er bij heeft gezet.

Dit werkt dus, omzetten naar andere xml werkt vervolgens ook en nu moet die nieuwe XML DOM weer terug in de oude HTML DOM, daar zit ik nog even op te borduren.

Als ik namelijk de xml property van dat stukje nieuwe XML DOM uitlees en dat gewoon gooi in de innerHTML van een HTML element (lekker IE only he :P), dan krijg ik er op de een of andere manier:
code:
1
<?xml:namespace prefix = svg />

voor het hele gebeuren er bij in.

Nu is het nieuwe stukje XML een stuk SVG en ik wil eigenlijk dat de adobe SVG viewer dat oppakt. Dat lukt echter nog niet (ik krijg de textContent te zien) en dat komt iig deels door die maffe (halve) pi, want als ik dat in een standalone document met svg content (dat werkt) erbij plak, pikt de viewer het ook niet meer.

Rara, hoe krijg ik dat weg? (die pi komt er pas in op het moment dat ik hem in de innerHTML plak, is dus geen resultaat uit de XML DOM).

Weer de hele boel recursief terug omzetten zou misschien weer een mogelijkheid zijn natuurlijk

[ Voor 33% gewijzigd door Verwijderd op 27-02-2006 11:28 ]