Konvertieren von XML in HTML mit jquery/javascript
Habe ich einige XML
die ich brauche, um zu zeigen, in einem div
als text.
Können wir konvertieren diese XML
format wie unten.
<root>
<field>
<label>Have you invested before</label>
<value>No</value>
</field>
<field>
<label>Are you looking to invest in the next 6 months</label>
<value>Maybe</value>
</field>
<field>
<label>What investments are you interested in</label>
<value>Carbon Credits, Green Investments</value>
</field>
<field>
<label>How much are you looking to invest</label>
<value>£50,000 - £100,000</value>
</field>
</root>
Ausgabe soll wie unten:
Haben Sie investiert vor : Keine
Sind Sie auf der Suche zu Investieren, in den nächsten 6 Monaten : Vielleicht
Welche Investitionen sind Sie interessiert : Carbon Credits,die Grüne Investitionen
Wie viel sind Sie suchen, um zu investieren : £50,000 - £100,000
Ist das möglich mit Hilfe von Jquery/javascript.??
Sein und es sollte-rendering wie unter HTML.
<div class="how-to">
<div class="how-text">
<h3>Your Requirements</h3>
<ul class="requirements">
<li><label class="field-l">Have you invested before:</label> <span>No</span></li>
<li><label class="field-l">Are you looking to Invest in the next 6 months:
</label> <span>Maybe</span></li>
<li><label class="field-l">What Investments are you interested in:</label>
<span>Carbon Credits,Green Investments</span></li>
<li><label class="field-l">How much are you looking to invest:</label>
<span>£50,000 - £100,000</span></li>
<li class="link-pad"><a href="index.html" class="requirements">
Change your requirements</a></li>
</ul>
<div class="clear"></div>
</div>
</div>
Okay, aber was auch immer Zeichenfolge ist, ich bin der Erzeugung dieses mit einige dynamische steuert Ihr eine Art Jquery-Formular-generator..mit der Hilfe, die ich leisten kann, es als HTML-Steuerelemente..aber ich muss es als text als auch zusammen mit controls...ich bin nicht in der Lage, das zu tun..das ist der Grund, warum ich um Hilfe gebeten..derzeit bin ich nicht, wo mit dem code..
Dein XML ist nicht wohlgeformt. Sie können keine Leerzeichen in den tags, sonst sind Sie Attribute und müssen einen Wert haben.
Ich writed ein Beispiel für Sie. Wie Austin sagt, das größte problem deiner Frage ist, dass es nicht gültige xml. Bitte Bearbeiten Sie die Frage für zukünftige Referenzen.
Bearbeitet wie pro Ihre Antwort.. 😉 danke
Dein XML ist nicht wohlgeformt. Sie können keine Leerzeichen in den tags, sonst sind Sie Attribute und müssen einen Wert haben.
Ich writed ein Beispiel für Sie. Wie Austin sagt, das größte problem deiner Frage ist, dass es nicht gültige xml. Bitte Bearbeiten Sie die Frage für zukünftige Referenzen.
Bearbeitet wie pro Ihre Antwort.. 😉 danke
InformationsquelleAutor Mayank Pathak | 2013-04-19
Du musst angemeldet sein, um einen Kommentar abzugeben.
Schritt 1: überprüfen Sie Ihre xml -
Dein xml ist nicht gültig. Sie können es überprüfen, es gültig ist oder nicht, zum Beispiel, in einem online-validator. Es gibt viele von Ihnen, das ich verlinkte, ist nur ein Beispiel.
Für diese Antwort ich werde suposse wir haben einige xml wie folgt
Schritt 2: Holen Sie sich die xml -, vielleicht durch ajax
Ich suposse das ist offensichtlich, aber ich werde auch hier auf jeden Fall.
Schritt 3: Parsen der xml -
Können Sie die jQuery - $.parseXML analysieren und konvertieren der raw-Daten in ein XML-Dokument
Schritt 4: spielen Sie mit den Daten
Nun haben wir ein xml-Dokument mit zu spielen. Die folgenden snipnet meint, wir haben eine definition Liste
<dl>
- tag in unserem HTML-layout, und ist supossed werden ausgeführt, nachdem die Daten analysiert wurden, wie im vorherigen Schritt.Abschluss
jQuery ist, was Sie verwenden möchten. Es ist verkettbare Natur macht transversing der DOM wie das schneiden von butter. Ich hoffe, diese Antwort nützlich sein für Sie.
Als zusätzliche Referenz finden Sie in der vollständiges Beispiel auf jsfiddle
Besser?
Wow. Dies ist einer der besten Antworten, die ich gesehen habe, auf SO (nicht mitgerechnet Jon Skeet ist).
Viel, viel besser. Gut geschrieben!
Dank laconbass..ich generierte XML auf diese Weise, und es funktionierte für mich..danke Kumpel.. 🙂
InformationsquelleAutor laconbass