[Erledigt] mit DOM Manipulation gültiges XHTML erstellen

litterauspirna · 17.12.2010, 10:37

Hallo Leute,

eigentlich steht meine Frage anliegen ja schon im Titel. Wie kann ich wenn ich mit DOM Manipulation ein HTML Dokument erweitere gültige XHTML Elemente erstellen?

Mein bisheriger Code funktioniert, aber erstellt kein gütliges XHTML.

Hier mein Code.

Code:

<html>
<head>

    <script type="text/javascript">
        
        var a = function (){
            
            document.body.removeChild( document.body.firstChild.nextSibling );
        }
        
        window.onload = a;
        
        var newUploadField = function ( idForm ) {
            
            var newField = document.createElement( "input" );
            var newBr = document.createElement( "br" );
            var attributName = document.createAttribute( "name" );
            var attributType = document.createAttribute( "type" );
            attributName.nodeValue = "img[]";
            attributType.nodeValue = "file";
            newField.setAttributeNode( attributName );
            newField.setAttributeNode( attributType );
            
            document.getElementById( idForm ).appendChild( newBr );
            document.getElementById( idForm ).appendChild( newField );
        }
        
    </script>

</head>
<body>
    <p>
        Javascript ist nicht aktiviert
    </p>
    <div>
        <form id="post_artikel" action="" method="post">
            <div id="uploadFields">
                <input type="file" name="img[]">
            </div>
        </form>
    </div>
    <p>
        <span><a href="#" onclick="newUploadField('uploadFields')">Neues Uploadfeld hinzufügen</a></span>
    </p>
</body>
</html>

Das ist alles nur zur Übung.

Wenn ich das so schreiben will,

Code:

var newBr = document.createElement( "br /" );

dann bekomme ich in der Fehlerkonsole folgende Fehlermeldung.

Zitat:

Fehler: uncaught exception: [Exception... "String contains an invalid character" code: "5" nsresult: "0x80530005 (NS_ERROR_DOM_INVALID_CHARACTER_ERR)" location: "http://localhost/Parkatikum_Sedna_Soft/Javascript_Uebungen/erste_uebungen.html# Line: 16"]

ich denke mein Problem habe ich klar beschrieben, oder hoffe ich zumindest. Meine Frage steht ja eigentlich auch schon hier dirn, wie bekomme ich mit der DOM Manipulation gültigen XHTML Code hin?

Danke für eure Zeit und Hilfe.

Gruß Litter

Chriz · 17.12.2010, 11:40

document.createElement( "<br/>" );

Alles was du ins DOM über die DOM-Funktionen hinzufügst ist bereits gültig.

litterauspirna · 17.12.2010, 12:41

Zitat:

Zitat von Chriz

document.createElement( "<br/>" );

Alles was du ins DOM über die DOM-Funktionen hinzufügst ist bereits gültig.

Nein das geht eben auch nicht, folgende Exception wird in der Fehlerkonsole geworfen.

Zitat:

Fehler: uncaught exception: [Exception... "String contains an invalid character" code: "5" nsresult: "0x80530005 (NS_ERROR_DOM_INVALID_CHARACTER_ERR)" location: "http://localhost/Parkatikum_Sedna_Soft/Javascript_Uebungen/erste_uebungen.html# Line: 15"]

Und so ist der Code.

Code:

var newUploadField = function ( idForm ) {
            
            var newBr = document.createElement( "<br/>" );
            var newField = document.createElement( "input" );
            var attributType = document.createAttribute( "type" );
            attributType.nodeValue = "file";
            newField.setAttributeNode( attributType );
            var attributName = document.createAttribute( "name" );
            attributName.nodeValue = "img[]";
            newField.setAttributeNode( attributName );
            
            document.getElementById( idForm ).appendChild( newBr );
            document.getElementById( idForm ).appendChild( newField );
        }

ChrisB · 17.12.2010, 13:59

Zitat:

Zitat von litterauspirna

var newField = document.createElement( "input" );

Hier übergibst du als Parameter den Namen des Elements, das du erzeugen willst.

Zitat:

Wenn ich das so schreiben will,

Code:

var newBr = document.createElement( "br /" );

dann bekomme ich in der Fehlerkonsole folgende Fehlermeldung.

Wieso kriegst du es hier nicht mehr gebacken, einfach nur den Elementnamen als Parameter zu verwenden ...?

Zitat:

Meine Frage steht ja eigentlich auch schon hier dirn, wie bekomme ich mit der DOM Manipulation gültigen XHTML Code hin?

Mach dir klar, dass das DOM etwas ganz anderes ist, als in Code-Form geschriebenes HTML.

litterauspirna · 17.12.2010, 14:04

ChrisB, danke nun ist mir das selber auch klar geworden. Da das was ich ja da hinzufügen kann mit dem DOM nie im Hardcoding steht kann das auch kein wirklich unsauberes XHTML darstellen, denn es wird ja so nicht in die HTML Datei an sich geschrieben.

Danke für den Anstoß.

Gruß Litter

Chriz · 17.12.2010, 14:09

Äh quatsch, war gedanklich bei jQuery.

nikosch · 17.12.2010, 15:09

Meines Wissens passiert das je nach Konfiguration des DOMDocument Objektes automatisch. Sieh auch: http://de.php.net/manual/en/domdocum...exml.php#95252 , http://de.php.net/manual/en/libxml.constants.php

ChrisB · 17.12.2010, 15:15

@nikosch: Wir reden hier über clientseitige DOM-Manipulation per JavaScript

nikosch · 17.12.2010, 15:17

OmG, geistige Umnachtung befällt mich. Thema verfehlt, 6, setzen

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
[Erledigt] Mysql - Query dynamisch erstellen - String zusammenfügen	zoom	PHP Tipps 2010	12	19.10.2010 13:50
Suche Freelancer (XHTML / JQuery / PHP)	rent-a-coder	Gewerblich	0	26.04.2010 19:07
[Erledigt] XHTML & image maps <> Opera	Frank	JavaScript, Ajax und mehr	1	21.03.2010 01:58
Websiteteile vom User erstellen lassen	magni	PHP Tipps 2009	4	15.12.2009 11:17
Kleinen PHP Script "Bannerrotation" aus MySQL-Datenbank erstellen...	ispvip	PHP Tipps 2009	2	03.11.2009 09:01
PHP Ordner erstellen mit bestimmten Namen	matzee	PHP Tipps 2009	13	04.09.2009 11:45
[Erledigt] jpeg erstellen aus textstring erstellen	Psydl	PHP Tipps 2009	16	07.07.2009 18:54
[Erledigt] foreach schleife beim erstellen einer image_map schlägt fehl	litterauspirna	PHP Tipps 2009	8	25.05.2009 13:04
(X)HTML 5 und Semantik?	tesim	HTML, Usability und Barrierefreiheit	11	01.05.2009 23:35
[Erledigt] XHTML nicht valide ?!	drsoong	HTML, Usability und Barrierefreiheit	9	29.11.2008 21:11
darf keine Datenbank erstellen in phpMyAdmin		Datenbanken	2	20.10.2005 19:32
Icons für Pocket-Pcs erstellen?	Locutus007	Off-Topic Diskussionen	0	19.08.2005 14:38
Stammbaum erstellen	Riot	PHP Tipps 2005	17	13.05.2005 16:32
Ordner erstellen und Datei uploaden	Juuro	PHP Tipps 2005	6	20.01.2005 21:18
Ordner per Skript erstellen --> Rechte Problem		PHP Tipps 2004	2	06.07.2004 14:19


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

17.12.2010, 11:40
Chriz Moderator Registriert seit: 11.05.2008 Beiträge: 6.266	document.createElement( "<br/>" ); Alles was du ins DOM über die DOM-Funktionen hinzufügst ist bereits gültig. __________________ "Nuschel ich?" - "Was?"

17.12.2010, 14:04
litterauspirna Erfahrener Benutzer Registriert seit: 24.04.2008 Beiträge: 3.172 PHP-Kenntnisse: Anfänger	ChrisB, danke nun ist mir das selber auch klar geworden. Da das was ich ja da hinzufügen kann mit dem DOM nie im Hardcoding steht kann das auch kein wirklich unsauberes XHTML darstellen, denn es wird ja so nicht in die HTML Datei an sich geschrieben. Danke für den Anstoß. Gruß Litter __________________ Aus dem Dynamo Lande kommen wir. Trinken immer reichlich kühles Bier. Und dann sind wir alle voll, die Stimmung ist so toll. Aus dem Dynamo Lande kommen wir. http://www.lit-web.de

17.12.2010, 14:09
Chriz Moderator Registriert seit: 11.05.2008 Beiträge: 6.266	Äh quatsch, war gedanklich bei jQuery. __________________ "Nuschel ich?" - "Was?"

17.12.2010, 15:09
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Meines Wissens passiert das je nach Konfiguration des DOMDocument Objektes automatisch. Sieh auch: http://de.php.net/manual/en/domdocum...exml.php#95252 , http://de.php.net/manual/en/libxml.constants.php __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

17.12.2010, 15:15
ChrisB Moderator¹ Registriert seit: 28.03.2010 Beiträge: 7.470 PHP-Kenntnisse: Fortgeschritten	@nikosch: Wir reden hier über clientseitige DOM-Manipulation per JavaScript __________________ RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?

17.12.2010, 15:17
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	OmG, geistige Umnachtung befällt mich. Thema verfehlt, 6, setzen __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --