Announcement

Collapse
No announcement yet.

XML Daten mit JavaScript auslesen

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • XML Daten mit JavaScript auslesen

    Hallo Zusammen,

    könnt ihr mir weiterhelfen?

    Ich versuche aus einer XML-Datei
    (details hier)


    Code:
    <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
    
    
    
    <adressverwaltung>
    
    <eintrag id="1"> nummer eins 
    	<vorname>Max </vorname>
    	<nachname>Mustermann</nachname>
    	<strasse nr ="22"> teststr </strasse>
    	<ort plz="12345"> testort </ort>
    </eintrag>
    
    
    <eintrag id="2"> nummer zwei 
    	<vorname>Tina </vorname>
    	<nachname>Neuland</nachname>
    	<strasse nr ="88"> schillerstr </strasse>
    	<ort plz="55555"> irgendwo </ort>
    </eintrag>
    
    </adressverwaltung>

    die Daten der XML-datei per JavaScript in eine HTMLseite auszugeben.
    Leider komm ich mit meinem JavaScript Code nicht sehr weit voran ;/

    Habt ihr Möglichkeiten,Ideen, Codes XML-Elemente, XML-Attribute per JS auszulesen?



    Vielen Dank im voraus!

    Viele Grüße.
    Zuletzt editiert von Christian Marquardt; 08.07.2012, 18:46. Reason: Wiederhergestellt

  • #2
    http://www.communardo.de/home/techbl...script-parsen/
    Christian

    Comment


    • #3
      Hallo Christian,

      vielen Dank für den Link!
      Manchmal sehen 4 Augen doch mehr als 2 im www

      Leider klappt es bei mir trotzdem nicht? ;/
      Könntest du mir ggf. zu meinem kurzen xml-beispiel und dem link weiterhelfen? - wie würdest du das in den programmcode integrieren?

      Vielen Dank!

      Grüße!

      Comment


      • #4
        Leider klappt es bei mir trotzdem nicht? ;/
        Ist kein Fehler. Was klappt wieso nicht? Fehlermeldung? Auswirkung
        Christian

        Comment


        • #5
          @christian:


          Naja, ich bekomme gar keine ausgabe (ohne fehlermeldung)
          da ich den "code" wohl falsch platziere oder gar die function MyParseXml(xmlString) falsch anwende!?
          Ich muss doch die funktion mit einem übergabeparameter anwenden? Klappt nicht ;(

          Habe das xml-bsp aus der www-seite nachgetippt...
          Habe den"functionscode" in meine html page eingebaut,
          noch den <script type="text/javascript"> davor und danach eingebaut...
          aber weiß nicht wie ich auf die books-xml datei(daten) nun zuweisen soll.

          var x=xmlDoc.getElementsByTagName(‘book’); //oder wasauchimmer
          Dort kann man ja die "elemente" ansprechen, aber wie kann ich auf die gesamte xml-datei verweisen (bzw der function mitteilen, nehme die datei und parse um....) ;/

          danke nochmals!
          grüße!

          Comment


          • #6
            Hier ein Beispiel, das ab IE 7 und ansonsten in Firefox, Safari, Opera funktionieren sollte:
            Code:
            var req = new XMLHttpRequest();
            req.open('GET', 'datei.xml', true);
            req.onreadystatechange = function() {
              if (req.readyState === 4) {
                var doc = req.responseXML;
                var entries = doc.getElementsByTagName('eintrag');
                var ul = document.createElement('ul');
                for (var i = 0, l = entries.length; i < l; i++) {
                  var entry = entries[i];
                  var naEl = entry.getElementsByTagName('nachname')[0];
                  var streetEl = entry.getElementsByTagName('strasse')[0];
                  var li = document.createElement('li');
                  li.appendChild(document.createTextNode((naEl.textContent ? naEl.textContent : naEl.text) + '; ' + (streetEl.textContent ? streetEl.textContent : streetEl.text) + ' ' + streetEl.getAttribute('nr')));
                  ul.appendChild(li);
                }
                document.body.appendChild(ul);
              }
            };
            req.send(null);
            Ich habe bewusst nicht alle Element und Attribute ausgelesen, sondern nur exemplarisch gezeigt, wie man Elemente und Attribute ausliest, du musst selbst dann dem Beispiel folgend weitere Elemente und Attribute auslesen, die du auslesen willst.
            So IE 6 auch unterstützt werden soll, muss man die erste Zeile "var req = new XMLHttpRequest();" mit folgendem ersetzen:
            Code:
            var req;
            if (typeof XMLHttpRequest !== 'undefined') {
              req = new XMLHttpRequest();
            }
            else if (typeof ActiveXObject !== 'undefined') {
              req = new ActiveXObject('Msxml2.XMLHTTP.3.0');
            }

            Comment


            • #7
              Hey Martin,

              viellllen Dank!!!
              Also im FF 4.0 gehts
              IE 9.0 zeigts mir nicht an - aber nicht so schlimm - arbeite eher mit dem FF^^


              Habe mal den code angepasst, eingerückt... und es geht endlich

              Code:
              <html>
              
              <body>
              
              <script type="text/javascript">
              
              	var req = new XMLHttpRequest();
              	
              	req.open('GET', 'adressbuch.xml', true);
              	req.onreadystatechange = function() 
              	{
              		if (req.readyState === 4) 
              		{
              			var doc = req.responseXML;
              			
              			// entries! vs entry!
              			var entries = doc.getElementsByTagName('eintrag');
              			
              			
              			
              			var ul = document.createElement('table');
                  
              				for (var i = 0, l = entries.length; i < l; i++) 
              				{
              					// entry! vs entries!
              					var entry = entries[i];
              									
              					var vnEl = entry.getElementsByTagName('vorname')[0];					
              					var naEl = entry.getElementsByTagName('nachname')[0];
              					var streetEl = entry.getElementsByTagName('strasse')[0];
              					var ortEl = entry.getElementsByTagName('ort')[0];
              					
              					var li = document.createElement('li');
              									
              					
              					li.appendChild(document.createTextNode
              					(
              						(vnEl.textContent ? vnEl.textContent : vnEl.text) 
              						+
              						(naEl.textContent ? naEl.textContent : naEl.text) 
              						+ 
              						'; '
              						+
              						(streetEl.textContent ? streetEl.textContent : streetEl.text) 
              						+ 
              						' '
              						+ 
              						streetEl.getAttribute('nr') 
              						+ 
              						'; '  
              						+ 
              						ortEl.getAttribute('plz')
              						+						
              						(ortEl.textContent ? ortEl.textContent : ortEl.text) 
              						+
              						' ;'
              											
              						
              					));
              										
              					ul.appendChild(li);
              				}
              			document.body.appendChild(ul);
              		}
              	};
              
               req.send(null);
              
              </script> 
              
              
              </body>
              </html>


              ########
              frage1
              ########

              Code:
              <adressverwaltung>
              
              <eintrag id="1"> nummer eins 
              	<vorname>Max </vorname>
              	<nachname>Mustermann</nachname>
              	<strasse nr ="22"> teststr </strasse>
              	<ort plz="12345"> testort </ort>
              </eintrag>
              
              
              <eintrag id="2"> nummer zwei 
              	<vorname>Tina </vorname>
              	<nachname>Neuland</nachname>
              	<strasse nr ="88"> schillerstr </strasse>
              	<ort plz="55555"> irgendwo </ort>
              </eintrag>
              
              </adressverwaltung>
              ich bekomme es aber nicht hin,
              dein inhalt von "eintrag" und das dazugehörige attribut "id" auszulesen ;/


              ########
              frage2,3
              ########

              ich tüftel gerade daran,
              diese 'function' und deren ausgabe

              an eine
              # HTML-tabellen,
              # an ein HTML Drop Down Box

              weiterzuleiten,
              gestalltet sich aber schwerer als gedacht ;/

              Bzw könnte man nicht diesen js-code in eine function "einpacken"
              und dann iwie weitergeben....?!

              Hast du/ihr tipps...?!



              Danke im voraus!!!
              Grüße ans forum!

              Comment


              • #8
                entry.getAttribute("id") sollte doch klar sein und auch ohne Probleme funktionieren.
                Der "Inhalt" von "eintrag" ist schwieriger, weil nicht klar ist, was genau damit gemeint ist, ausserdem ist die gewählte XML-Struktur keine gute, da Textinhalt mit Kindelementen gemischt ist. Ich vermute, du willst
                Code:
                var entryText = entry.firstChild.nodeValue;
                Was IE betrifft, ich habe im Moment hier unter Windows XP keine Gelegenheit, IE 9 zu testen. Aber an sich sollte das funktionieren, das einzige Problem könnte sein, so du alle Dateien direkt aus dem Dateisystem lädst, da gibt es eventuell mit XMLHttpRequest und IE Probleme. Über HTTP sollte es aber klappen.

                Was die anderen Fragen angeht, eine Tabelle oder ein Select-Element mit Javascript zu erzeugen und/oder zu füllen, hat ja nichts mit XML zu tun. Frag halt in http://entwickler-forum.de/forumdisplay.php?f=150, so das nicht klappt. Letztlich muss man dazu nur HTML und das DOM kennen und dann per DOM Core und HTML Elemente erstellen und Eigenschaften setzen.

                Comment


                • #9
                  @martin:
                  vielen dank!!!

                  Das mit dem attribut "id" hat nun geklappt



                  Code:
                  var entryText = entry.firstChild.nodeValue;
                  Ja ich wollte noch den "text" nummer eins, nummer zwei... auslesen lassen aus den tags von <eintrag>.

                  <eintrag id="1"> nummer eins ...

                  Werd den code noch iwie integrieren müssen mom läufts noch ned *grübel*


                  "andere Fragen"
                  danke dir, dann werd ich mal das in dem anderen bereich posten

                  Nochmals danke!
                  Grüße!

                  Comment

                  Working...
                  X