Zum Inhalt springen

XML-Datei mittels Javascript auslesen


Gast Caipi20

Empfohlene Beiträge

Hallo,

ich hoffe, dass mir hier jemand bei meiner Aufgabe behilflich sein kann, folgendes Problem:

 

Ich möchte Daten aus einer XML-Datei auslesen bzw in html konvertieren.

 

Es geht um diesen XML-Auszug(Platzhalter eingefügt!):

  <Scrip>
    <Type>D</Type>
    <Number>987654</Number>
    <test code="123">
      <topic>DUMMY1</topic>
      <IA>321</IA>
      <IC>123</IC>
    </test>
    <ScheduledTime>2017-08-20T11:10:00.000+03:00</ScheduledTime>
    <ActualTime>2017-08-20T11:10:00.000+03:00</ActualTime>
    <top name="Dummy" shortName="DUMMY" ia="321" ic="123">
      <Translation language="en">DUMMY</Translation>
    </top>
    <Type1>DUMMY</Type1>
    <KindOfType>A</KindOfType>
    <Fids code="DUMMY">
      <Translation language="en">DUMMY</Translation>  
    </Fids>
  </Scrip>


 

Was ich bisher habe:

// just removed the line breaks
var rawXML = '<?xml version="1.0" encoding="utf-8"?>  <Scrip> <Type>D</Type> 
 <Number>987654</Number> 
  <test code="123">    
    <topic>DUMMY1</topic>    
    <IA>321</IA>    
    <IC>123</IC>  
  </test>  
  <ScheduledTime>2017-08-20T11:10:00.000+03:00</ScheduledTime>   
  <ActualTime>2017-08-20T11:10:00.000+03:00</ActualTime>   
  <top name="Dummy" shortName="DUMMY" ia="321" ic="123"> 
    <Translation language="en">DUMMY</Translation> 
  </top>  
  <Type1>DUMMY</Type1>   
  <KindOfType1>A</KindOfType1> 
  <Fids code="DUMMY">   
    <Translation language="en">DUMMY1</Translation>
  </Fids>
</Scrip>';

// Parse it
var xmlParsed = $.parseXML(Scrip);

// find the <document> tag
var xmlDoc = $(xmlParsed).find('Scrip');

// find the <row> tag
var xmlRow = xmlDoc.find('Type'+'Number'+'test code'+'topic'+'IA'+'IC'+'ScheduledTime'+'ActualTime'+'top name'+'shortName'+'ia'+'ic'+'Translation language'+'Type1'+'KindOfType'+'Fids code');


// loop over <row> tags
$(xmlRow).each(function() {
    for(var i=0; i < 10; i++) {
      // find the Col + i and append it's text to the #xmlstuff div
      $('#xmlstuff').append($(this).find('Type'+'Number'+'test code'+'topic'+'IA'+'IC'+'ScheduledTime'+'ActualTime'+'top name'+'shortName'+'ia'+'ic'+'Translation language'+'Type1'+'KindOfType'+'Fids code' + i).text()).append('<br/>');   
    }
});
  
  
  
  Erstellt bei: jsfiddle

 

 

Als Referenzen habe ich diese beiden Seiten:

http://www.daigo.org/2010/08/simple-xml-to-html-table-using-jquery/

https://www.sitepoint.com/community/t/how-to-convert-xml-fille-to-html-table-using-jquery/192282/2

 

 

 

Es funktioniert halt nicht so wie ich es will, leider bin ich auch kein Programmierass um meinen Fehler zu erkennen. Wäre toll, wenn mir jemand aufzeigt woran es liegt.

Gruß, caipi

 

Bearbeitet von Caipi20
Link zu diesem Kommentar
Auf anderen Seiten teilen

Ich will eigentlich nur eine Ausgabe der Daten haben.

 

"Scrip" ist quasi ein ganzer Datenblock. Von Scrip habe ich noch ungefähr 200 weitere Inhalte nach dem gleichen Aufbau jedoch anderen Inhalten.

Link zu diesem Kommentar
Auf anderen Seiten teilen

Ein Anfang würde so aussehen:

<!doctype html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    </head>
    <body>
        <script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
        <script>
            var rawXML = '<?xml version="1.0" encoding="utf-8"?><Scrip> <Type>D</Type><Number>987654</Number><test code="123"><topic>DUMMY1</topic><IA>321</IA><IC>123</IC></test><ScheduledTime>2017-08-20T11:10:00.000+03:00</ScheduledTime><ActualTime>2017-08-20T11:10:00.000+03:00</ActualTime><top name="Dummy" shortName="DUMMY" ia="321" ic="123"><Translation language="en">DUMMY</Translation></top><Type1>DUMMY</Type1><KindOfType1>A</KindOfType1><Fids code="DUMMY"><Translation language="en">DUMMY1</Translation></Fids></Scrip>';
            jQuery(document).ready(function () {
                
                var parsedXml = jQuery.parseXML(rawXML);
                
                jQuery(parsedXml).find('Scrip').each(function(index, row) {
                    var paragraph = jQuery('<p>');
                    paragraph.append('<span>' + jQuery(row).find("topic").text() + '</span>');
                    paragraph.append('<span>' + jQuery(row).find("Number").text() + '</span>');
                    jQuery('#entries').append(paragraph);
                });

            });
        </script>
        <div id="entries"></div>
    </body>
</html>

https://api.jquery.com/jQuery.parseXML/

Da du da noch verschachtelte Elemente hast, wirst du dir noch Gedanken machen müssen wie du mit denen umgehst.

 

Zitat

var xmlRow = xmlDoc.find('Type'+'Number'+'test code'+'topic'+'IA'+'IC'+'ScheduledTime'+'ActualTime'+'top name'+'shortName'+'ia'+'ic'+'Translation language'+'Type1'+'KindOfType'+'Fids code');

An der Stelle fügst du übrigens nur Strings zusammen. Der Selektor für das obige würde also so aussehen: "TypeNumbertest codetopocIAICScheduledTimeActualTime..."

Habe bisher noch nichts mit JQuery + XML gemacht, aber falls man bei der find()-Methode mehrere Selektoren angeben kann, sollte es reichen wenn du die einfach per Leerzeichen trennst: "Type Number test topic..." (Das "code" bei test ist ein Attribut, kein Tag)

Link zu diesem Kommentar
Auf anderen Seiten teilen

Dein Kommentar

Du kannst jetzt schreiben und Dich später registrieren. Wenn Du ein Konto hast, melde Dich jetzt an, um unter Deinem Benutzernamen zu schreiben.

Gast
Auf dieses Thema antworten...

×   Du hast formatierten Text eingefügt.   Formatierung wiederherstellen

  Nur 75 Emojis sind erlaubt.

×   Dein Link wurde automatisch eingebettet.   Einbetten rückgängig machen und als Link darstellen

×   Dein vorheriger Inhalt wurde wiederhergestellt.   Editor leeren

×   Du kannst Bilder nicht direkt einfügen. Lade Bilder hoch oder lade sie von einer URL.

Fachinformatiker.de, 2024 by SE Internet Services

fidelogo_small.png

Schicke uns eine Nachricht!

Fachinformatiker.de ist die größte IT-Community
rund um Ausbildung, Job, Weiterbildung für IT-Fachkräfte.

Fachinformatiker.de App

Download on the App Store
Get it on Google Play

Kontakt

Hier werben?
Oder sende eine E-Mail an

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte

×
×
  • Neu erstellen...