Validation von erzeugtem HTML

Gast · 20 Februar 2011

Hallo,

ich habe ein XML-Dokument, das ich durch XSLT umwandeln kann, was im Browser erfolgreich angezeigt wird.
Jetzt habe ich mit Hilfe des "Umwandlungsprogramms" Sablotron den erzeugten XHTML-Code davon in einer HTML-Datei gespeichert.
Nun soll für diese Datei wegen der Validation (XHTML 1.0 Strict) die angezeigten Fehler (um die 30) beseitigt werden. Das könnte ich in der erzeugten HTML für diese Datei ja machen.
ABER: Dann könnte ich mit der XML- und dem XSL-Dokument erneut (durch Sablotron) eine HTML-Datei erzeugen lassen, in der die gleichen Fehler wieder sind, da ich VOR der Erzeugung (in dem XML- oder XSL-Dokument) ja keine Fehler entfernt habe.
Ich suche also einen Weg, wie die erzeugte HTML-Datei fehlerfrei aus dem Sablotron erstellt wird. Dazu müsste ich doch vorher etwas ändern?
(Die XML-Datei bzw. das XSLT habe ich erfolgreich validiert.)
Geht das überhaupt, was ich hier verlange, oder verstehe ich die Vorhergehensweise, richtiges HTML herauszubekommen, falsch?
P.S.: Es ist eben nicht verlangt, die korrigierten erzeugten HTML-Dateien zu bekommen,
sondern die XML-Dateien, die dann korrektes HTML nach der Umwandlung ausgeben.
Ich hoffe, ich konnte mich verständlich ausdrücken und bitte um schnelle Rückmeldung.

mermshaus · 20 Februar 2011

Willkommen im Forum.

Worin bestehen denn die Fehler?

Gast · 20 Februar 2011

Das sind meist syntaktische Fehler, die im HTML dann auftauchen. Bspw. dass ein Tag nicht mit "/" geschlossen wurde oder dass ein Element "<li>" an dieser Stelle nicht stehen darf, solche Dinge. Ich weiß auch nicht, wo die herkommen, da in der XSL-Datei ja alles korrekt ist und validiert wurde.

mermshaus · 20 Februar 2011

Wenn die XML-Datei und das XSL-Sheet valide sind, heißt das ja noch nicht, dass auch der generierte Output des XSL-Sheets valide sein muss.

Ich würde den Fehler nicht im Parser suchen, sondern in den Transformationsregeln im XSL-Sheet.

Gast · 20 Februar 2011

Also sollte ich in der Struktur der Stylesheets in der XSL-Datei etwas verändern, sodass durch diese Umwandlung dann später korrektes HTML rauskommt?
Wie kann ich das dann machen bzw. wie kann ich da einen Bezug zu den ausgegebenen Fehlern finden?

mermshaus · 20 Februar 2011

Du siehst ja, was am Ende falsch herauskommt.

Bspw. dass ein Tag nicht mit "/" geschlossen wurde oder dass ein Element "<li>" an dieser Stelle nicht stehen darf, solche Dinge.

Ich kann nur mutmaßen, wie die Quell-XML-Datei aussieht und welche Regeln in der XSL-Datei definiert sind.

Du müsstest denjenigen Teil in der XML-Datei finden, der die Grundlage für die spätere falsche HTML-Ausgabe bildet, und dann im XSL gucken, welche Regeln auf das entsprechende XML-Element angewendet werden.

Ein Beispiel:

- In der HTML-Datei steht ein nicht geschlossenes img-Element <img src="http://example.org/ein-bild.jpg">.
- In der Ausgangs-XML-Datei findest du dazu <bild quelle="ein-bild.jpg">.

Die XSL-Regeln, die für die falsche Ausgabe verantwortlich sind (so sie es denn sind), müssten sich also auf das XML-Element „bild“ beziehen.

Gast · 20 Februar 2011

Ok, das leuchtet mir ein.
Nur finde ich solche Fehler nicht in der XML-Datei. Man sollte dazusagen, dass diese von einem Programm generiert wurde, und zudem nicht sehr umfangreich ist.

mermshaus · 20 Februar 2011

Wenn, dann auch wohl in der XSL-Datei. Ich weiß es nicht. Am Ende liegt es wirklich an einer Parser-Einstellung. Das ist aber einfach schwer per Ferndiagnose zu sagen.

Wenn du XML und XSL zeigen könntest, würde das definitiv helfen.

Gast · 20 Februar 2011

Dann mach ich das doch mal:

XML-Datei:

Code:

<?xml version="1.0" encoding="UTF-8"?>
                
<!-- interne DTD-Definition fuer sichere Validitaet -->
<!DOCTYPE node [    
<!ELEMENT node (icon*, node*)>
<!ATTLIST node CREATED NMTOKEN #REQUIRED>
<!ATTLIST node ID NMTOKENS #REQUIRED>
<!ATTLIST node MODIFIED NMTOKEN #REQUIRED>
<!ATTLIST node POSITION (left | right) #IMPLIED>
<!ATTLIST node TEXT CDATA #IMPLIED>
<!ELEMENT icon EMPTY>
<!ATTLIST icon BUILTIN NMTOKENS #REQUIRED>
]>

<?xml-stylesheet type="application/xml" 
                            href="mindmap.xsl"?>

<node CREATED="1294763050520" ID="ID_806363441" MODIFIED="1294763517503" TEXT="Wurzel">

    <node CREATED="1294763399747" ID="ID_1287032066" MODIFIED="1294763406027" POSITION="right" TEXT="Punkt 1.1"/>
    <node CREATED="1294763407497" ID="ID_919322120" MODIFIED="1294763411589" POSITION="left" TEXT="Punkt 1.2">
        <node CREATED="1294763454599" ID="ID_940746620" MODIFIED="1294763461329" TEXT="Punkt 1.2.1">
            <node CREATED="1294763464769" ID="ID_1141871320" MODIFIED="1294763473491" TEXT="Punkt 1.2.1.1"/>
        </node>
        <node CREATED="1294763478761" ID="ID_716205397" MODIFIED="1294763485471" TEXT="Punkt 1.2.2"/>
        <node CREATED="1294763487781" ID="ID_68524474" MODIFIED="1294763494261" TEXT="Punkt 1.2.3"/>
    </node>
    <node CREATED="1294763414019" ID="ID_982695248" MODIFIED="1294763439819" POSITION="right" TEXT="Punkt 2.1">
        <node CREATED="1294763499251" ID="ID_1872256497" MODIFIED="1294763505041" TEXT="Punkt 2.1.1"/>
    </node>
    <node CREATED="1294763441259" ID="ID_573159203" MODIFIED="1294763448399" POSITION="left" TEXT="Punkt 2.2"/>
        
</node>

XSL:

Code:

<?xml version="1.0" encoding="UTF-8"?>

<xsl:stylesheet version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    
    <xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"
        doctype-system ="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
        doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN"/>

    <xsl:template match="/">
        <html xmlns="http://www.w3.org/1999/xhtml">
            <head>
                <link rel="stylesheet" type="text/css" href="mindmap.css"/>
            </head>
            <body>
                <!-- Links zu den Maps -->
                <img src="Bilder/freemind.ico"/>
                <a href="FreeMindMaps/mindmap1.mm">Original1</a>*
                <a href="mindmap1.xml">Resultat1</a>**
                <img src="Bilder/freemind.ico"/>
                <a href="FreeMindMaps/mindmap2.mm">Original2</a>*
                <a href="mindmap2.xml">Resultat2</a>**
                <img src="Bilder/freemind.ico"/>
                <a href="FreeMindMaps/mindmap3.mm">Original3</a>*
                <a href="mindmap3.xml">Resultat3</a>
                <!-- fuer jedes Element rekursive Methode aufrufen, count fuer die Ebenentiefe -->
                <xsl:for-each select="/">                
                    <xsl:call-template name="rek">
                        <xsl:with-param name="count" select="0"/>
                    </xsl:call-template>     
                </xsl:for-each>
            </body>
        </html>
       </xsl:template>
                        
    <xsl:template name="rek">
        <xsl:param name="count"/>
        <li>
            <!-- Abfrage der jeweiligen Ebene, Ausgabe der Elemente wird
                 den entsprechenden Klassen zugeordnet -->
            <xsl:choose>
                <xsl:when test="$count = 1">
                    <p class= "root">
                        <!--> Ausgabe der Knoten, Verlinkungen werden extra behandelt -->
                        <xsl:choose>
                            <xsl:when test="icon/@BUILTIN = 'forward'">
                                <xsl:element name="a">
                                    <xsl:attribute name="href">
                                        <xsl:value-of select="@TEXT" />
                                    </xsl:attribute>
                                    <xsl:value-of select="@TEXT"/>
                                </xsl:element>
                            </xsl:when>
                            <xsl:otherwise>                                
                                <xsl:value-of select="@TEXT"/>
                                <xsl:apply-templates select="icon/@BUILTIN"/>
                            </xsl:otherwise>
                        </xsl:choose>
                    </p>
                </xsl:when>
                <xsl:when test = "$count = 5">                        
                    <p class= "ebene4">
                        <xsl:choose>
                            <xsl:when test="icon/@BUILTIN = 'forward'">
                                <xsl:element name="a">
                                    <xsl:attribute name="href">
                                        <xsl:value-of select="@TEXT" />
                                    </xsl:attribute>
                                    <xsl:value-of select="@TEXT"/>
                                </xsl:element>
                            </xsl:when>
                            <xsl:otherwise>                                
                                <xsl:value-of select="@TEXT"/>
                                <xsl:apply-templates select="icon/@BUILTIN"/>
                            </xsl:otherwise>
                        </xsl:choose>
                    </p>
                </xsl:when>
                <xsl:when test = "$count = 2">                        
                    <p class= "ebene1">
                        <xsl:choose>
                            <xsl:when test="icon/@BUILTIN = 'forward'">
                                <xsl:element name="a">
                                    <xsl:attribute name="href">
                                        <xsl:value-of select="@TEXT" />
                                    </xsl:attribute>
                                    <xsl:value-of select="@TEXT"/>
                                </xsl:element>
                            </xsl:when>
                            <xsl:otherwise>                                
                                <xsl:value-of select="@TEXT"/>
                                <xsl:apply-templates select="icon/@BUILTIN"/>
                            </xsl:otherwise>
                        </xsl:choose>
                    </p>
                </xsl:when>
                <xsl:when test = "$count = 3">                        
                    <p class= "ebene2">
                        <xsl:choose>
                            <xsl:when test="icon/@BUILTIN = 'forward'">
                                <xsl:element name="a">
                                    <xsl:attribute name="href">
                                        <xsl:value-of select="@TEXT" />
                                    </xsl:attribute>
                                    <xsl:value-of select="@TEXT"/>
                                </xsl:element>
                            </xsl:when>
                            <xsl:otherwise>                                
                                <xsl:value-of select="@TEXT"/>
                                <xsl:apply-templates select="icon/@BUILTIN"/>
                            </xsl:otherwise>
                        </xsl:choose>
                    </p>
                </xsl:when>
                <xsl:otherwise>                    
                    <p class= "ebene3">
                        <xsl:choose>
                            <xsl:when test="icon/@BUILTIN = 'forward'">
                                <xsl:element name="a">
                                    <xsl:attribute name="href">
                                        <xsl:value-of select="@TEXT" />
                                    </xsl:attribute>
                                    <xsl:value-of select="@TEXT" />
                                </xsl:element>
                            </xsl:when>
                            <xsl:otherwise>                                
                                <xsl:value-of select="@TEXT"/>
                                <xsl:apply-templates select="icon/@BUILTIN"/>
                            </xsl:otherwise>
                        </xsl:choose>
                    </p>
                </xsl:otherwise>
            </xsl:choose>
        </li>
        <!-- jeder Unterknoten ruft wieder die Methode auf, Ebene wird erhoeht -->
        <xsl:for-each select="node">
            <ul>   
                <xsl:call-template name="rek">
                    <xsl:with-param name="count" select="$count+1"/>
                </xsl:call-template>
            </ul>
        </xsl:for-each>
    </xsl:template>                

</xsl:stylesheet>

Also es geht darum, Mindmaps aus einem Programm zu erstellen und diese dann in einer Baumstruktur entsprechend auszugeben.

mermshaus · 20 Februar 2011

Also, es liegt definitiv am XSL.

Hier eine (hoffentlich) verbesserte Version:

Code:

<?xml version="1.0" encoding="UTF-8"?>

<xsl:stylesheet version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

    <xsl:output method="xml" version="1.0" encoding="UTF-8" indent="yes"
        omit-xml-declaration="yes"
        doctype-system ="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
        doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN"/>

    <xsl:template match="/">
        <html xmlns="http://www.w3.org/1999/xhtml">
            <head>
                <link rel="stylesheet" type="text/css" href="mindmap.css"/>
                <title>Meine Mindmap</title>
            </head>
            <body>
                <!-- Links zu den Maps -->
                <p><img src="Bilder/freemind.ico" alt="Original1"/>
                <a href="FreeMindMaps/mindmap1.mm">Original1</a>*
                <a href="mindmap1.xml">Resultat1</a>**
                <img src="Bilder/freemind.ico" alt="Original2"/>
                <a href="FreeMindMaps/mindmap2.mm">Original2</a>*
                <a href="mindmap2.xml">Resultat2</a>**
                <img src="Bilder/freemind.ico" alt="Original3"/>
                <a href="FreeMindMaps/mindmap3.mm">Original3</a>*
                <a href="mindmap3.xml">Resultat3</a></p>
                <!-- fuer jedes Element rekursive Methode aufrufen, count fuer die Ebenentiefe -->
                <xsl:for-each select="node">
                    <ul>
                    <xsl:call-template name="rek">
                        <xsl:with-param name="count" select="0"/>
                    </xsl:call-template>
                    </ul>
                </xsl:for-each>
            </body>
        </html>
       </xsl:template>

    <xsl:template name="rek">
        <xsl:param name="count"/>
        <li>
            <!-- Abfrage der jeweiligen Ebene, Ausgabe der Elemente wird
                 den entsprechenden Klassen zugeordnet -->
            <xsl:choose>
                <xsl:when test="$count = 1">
                    <p class= "root">
                        <!--> Ausgabe der Knoten, Verlinkungen werden extra behandelt -->
                        <xsl:choose>
                            <xsl:when test="icon/@BUILTIN = 'forward'">
                                <xsl:element name="a">
                                    <xsl:attribute name="href">
                                        <xsl:value-of select="@TEXT" />
                                    </xsl:attribute>
                                    <xsl:value-of select="@TEXT"/>
                                </xsl:element>
                            </xsl:when>
                            <xsl:otherwise>
                                <xsl:value-of select="@TEXT"/>
                                <xsl:apply-templates select="icon/@BUILTIN"/>
                            </xsl:otherwise>
                        </xsl:choose>
                    </p>
                </xsl:when>
                <xsl:when test = "$count = 5">
                    <p class= "ebene4">
                        <xsl:choose>
                            <xsl:when test="icon/@BUILTIN = 'forward'">
                                <xsl:element name="a">
                                    <xsl:attribute name="href">
                                        <xsl:value-of select="@TEXT" />
                                    </xsl:attribute>
                                    <xsl:value-of select="@TEXT"/>
                                </xsl:element>
                            </xsl:when>
                            <xsl:otherwise>
                                <xsl:value-of select="@TEXT"/>
                                <xsl:apply-templates select="icon/@BUILTIN"/>
                            </xsl:otherwise>
                        </xsl:choose>
                    </p>
                </xsl:when>
                <xsl:when test = "$count = 2">
                    <p class= "ebene1">
                        <xsl:choose>
                            <xsl:when test="icon/@BUILTIN = 'forward'">
                                <xsl:element name="a">
                                    <xsl:attribute name="href">
                                        <xsl:value-of select="@TEXT" />
                                    </xsl:attribute>
                                    <xsl:value-of select="@TEXT"/>
                                </xsl:element>
                            </xsl:when>
                            <xsl:otherwise>
                                <xsl:value-of select="@TEXT"/>
                                <xsl:apply-templates select="icon/@BUILTIN"/>
                            </xsl:otherwise>
                        </xsl:choose>
                    </p>
                </xsl:when>
                <xsl:when test = "$count = 3">
                    <p class= "ebene2">
                        <xsl:choose>
                            <xsl:when test="icon/@BUILTIN = 'forward'">
                                <xsl:element name="a">
                                    <xsl:attribute name="href">
                                        <xsl:value-of select="@TEXT" />
                                    </xsl:attribute>
                                    <xsl:value-of select="@TEXT"/>
                                </xsl:element>
                            </xsl:when>
                            <xsl:otherwise>
                                <xsl:value-of select="@TEXT"/>
                                <xsl:apply-templates select="icon/@BUILTIN"/>
                            </xsl:otherwise>
                        </xsl:choose>
                    </p>
                </xsl:when>
                <xsl:otherwise>
                    <p class= "ebene3">
                        <xsl:choose>
                            <xsl:when test="icon/@BUILTIN = 'forward'">
                                <xsl:element name="a">
                                    <xsl:attribute name="href">
                                        <xsl:value-of select="@TEXT" />
                                    </xsl:attribute>
                                    <xsl:value-of select="@TEXT" />
                                </xsl:element>
                            </xsl:when>
                            <xsl:otherwise>
                                <xsl:value-of select="@TEXT"/>
                                <xsl:apply-templates select="icon/@BUILTIN"/>
                            </xsl:otherwise>
                        </xsl:choose>
                    </p>
                </xsl:otherwise>
            </xsl:choose>
        
        <!-- jeder Unterknoten ruft wieder die Methode auf, Ebene wird erhoeht -->
        <xsl:for-each select="node">
            <ul>
                <xsl:call-template name="rek">
                    <xsl:with-param name="count" select="$count+1"/>
                </xsl:call-template>
            </ul>
        </xsl:for-each>
        </li>
    </xsl:template>

</xsl:stylesheet>

XHTML scheint als <xsl

utput method="xml"> transformiert werden zu müssen. Frag mich nicht. Die Rekursion muss zudem in den schließenden </li>-Tag geschachtelt werden, nicht dahinter.

Die Rekursion scheint ein valides Resultat zu erzeugen, passt aber immer noch nicht perfekt. Ich habe leider gerade nicht die Geduld, das länger zu probieren. Rekursion mit passender Schachtelung von ul/li ist immer etwas knifflig und XSL mache ich zu selten, um das aus dem Stegreif hinzukriegen.

Meine spontane Aussage zum Rekursionstemplate: Es wirkt etwas seltsam.

Habe es mir aber nicht so genau angesehen.

Gast · 20 Februar 2011

Dann danke ich dir schon mal für die Mühe.
Woher weiß ich denn oder wie erkenne ich, wo die Elemente genau wie angeordnet werden müssen bzw. dass sie falsch sind, da mir der Browser ja die richtige Anordnung zeigte?

Jetzt wirft mir das ja meine Ausgabe, die ich vorher korrekt aufgebaut hatte, wieder um.
Muss man jetzt einen Weg finden, sowohl den Baum richtig aufzubauen als auch keine Fehler mehr im späteren HTML-Code zu haben?

mermshaus · 20 Februar 2011

Bin mir nicht sicher, wie du das meinst.

Generiertes HTML mit der ursprünglichen XSL-Datei:

- http://people.ermshaus.org/marc/tmp/html.de/mindmap/mindmap1.html

Generiertes HTML mit der veränderten XSL-Datei:

- Meine Mindmap

Der W3C Validator gibt für den ersten URI 35 Fehler aus, für den zweiten 0.

Gast · 21 Februar 2011

In der Tat. Verzeih, ich hatte es falsch übernommen.^^
Recht herzlichen Dank.

Gast · 27 Februar 2011

Also nochmal: Ist es normal, dass es durch das Output:XML dann anders angezeigt wird? Weil wenn ich die genierte HTML im Browser aufrufe, erscheint bei mir äußerlich ein anderes Bild der Baumstruktur als vorher.
P.S.: Wie oder womit hast du das HTML denn generiert?

mermshaus · 27 Februar 2011

Ich musste <xslutput method="xml" setzen, um XHTML erzeugen zu können. Du hast ja einen XHTML-DOCTYPE angegeben. Es hat bei method="html" Syntaxfehler gegeben, weil die generierte Rückgabe nicht an allen Stellen X(HT)ML-konform gewesen wäre (etwa in einem erzeugten META-Tag).

Die Transformation habe ich direkt in NetBeans vorgenommen. Ich habe nicht herausfinden können, welche Bibliothek dahintersteckt. Aber ziemlich sicher einer der Java-Parser. Das sollte aber egal sein.

Ich verstehe aktuell nicht ganz, worin dein Problem besteht.

Gast · 27 Februar 2011

Das mit dem als XML gesetzten Output ist mir klar, das muss schon so sein.
Nur sieht das Resultat doch ganz anders aus:

Vorher:
http://dl.dropbox.com/u/13378521/old.jpg
Nachher:
http://dl.dropbox.com/u/13378521/new.jpg

mermshaus · 27 Februar 2011

Na ja, das liegt am CSS-Styling. Da müsstest du die Regeln entsprechend anpassen oder so. Das CSS war hier noch nicht Thema.

Gast · 27 Februar 2011

Hm, ich hatte das vorher so hingebastelt, dass es vernünftig aussah. Das wirft mir ja jetzt alles über den Haufen.
Eine Idee, wie und was ich da ändern könnte?

CSS-Datei:

Code:

ul {list-style-type: none}
p {margin: 0px}
/* Aufzaehlungszeichen und Abstand zwischen Elementen entfernen */

ul ul:last-child {background-image: url(Bilder/linie1.gif); background-position: up-left; background-repeat: no-repeat}
ul:not(:last-child) {background-image: url(Bilder/linie2.gif); background-position: up-left; background-repeat: no-repeat}
/* Pseudoklassen um die Linienbilder passend auszurichten */

.ebene1 {color: green; font-weight: bold}
.ebene2 {color: green}
.ebene3 {color: red}
.ebene4 {color: orange}
.leaf {font-style: normal}
.root {padding: 5px; color: red; background-color: yellow; font-size: large}
/* Ebenen- (letzte = leaf) und Wurzelklasse */

ul li:not(:last-child) {border-style: solid; border-width: thin; display: inline-block}
/* Pseudoklasse innernode fuer die Rahmen */

mermshaus · 27 Februar 2011

Kann ich so theoretisch nicht und die Grafiken habe ich nicht da. Aber das sollte nicht zu schwierig sein.

Gast · 28 Februar 2011

Was mich wundert, ist, dass er die verschiedenen Ebenen-Klassen in CSS nicht anerkennt und den entsprechenden Knoten zuordnet (müsste dann farblich gekennzeichnet sein). Zumal da an der Struktur ja nichts verändert wurde.
Müsste ich dann das CSS auf XML irgendwie umstellen oder gar in der XML-Datei dann einbinden?
Ich hoffe, du kennst dich da ausreichend aus.

Validation von erzeugtem HTML

Neues Mitglied

Senior HTML'ler

Neues Mitglied

Senior HTML'ler

Neues Mitglied

Senior HTML'ler

Neues Mitglied

Senior HTML'ler

Neues Mitglied

Senior HTML'ler

Neues Mitglied

Senior HTML'ler

Neues Mitglied

Neues Mitglied

Senior HTML'ler

Neues Mitglied

Senior HTML'ler

Neues Mitglied

Senior HTML'ler

Neues Mitglied