jquery -> XML -> CSS - Webmaster-Elite.de Forum

Talisin · 29.09.2009, 16:08

Hallo,

ich habe folgendes Problem:
Mit Hifle von jquery lese ich zur Zeit eine XML Datei aus und lasse diese mir ausgeben.

Der Code dazu sieht wie folgt aus:

XML Datei:

Code:

 <labels>
   <label id='ep' added="2003-06-10">
     <name>Ezra Pound</name>
     <address>
       <street>45 Usura Place</street>
       <city>Hailey</city>
       <province>ID</province>
     </address>
   </label>
   <label id='tse' added="2003-06-20">
     <name>Thomas Eliot</name>
     <address>
       <street>3 Prufrock Lane</street>
       <city>Stamford</city>
       <province>CT</province>
     </address>
   </label>
 </labels>

HTML Datei:

Code:

<!DOCTYPE html PUBLIC "-//W3C//  DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 <html>
   <head>
     <meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type">
     <title>Address book</title>
     <link type="text/css" rel="stylesheet" href="test.css" />
     <script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.1.js"></script>
     <script type="application/javascript">
     $(function() {
        $(document).ready(function(){

             $.ajax({
                 type: "GET",
                 url: "labels.xml",
                 dataType: "xml",
                 success: function(xml) {
                     $(xml).find('label').each(function(){
                         var id_text = $(this).attr('id')
                         var name_text = $(this).find('name').text()

                         $('<li></li>')
                             .html('<div class=test>' + name_text + ' (' + id_text + ')</div>')
                             .appendTo('#update-target');
                     });
                 }
             });
         });
     });
     </script>
   </head>
   <body>
       <div id='update-target'></div>
   </body>
 </html>

Dazu das CSS:

Code:

/* CSS Document */
test {
  float:left;
  border:1px
  solid #c0c0c0;
  margin:10px;
}

Das ganze funktioniert soweit sehr gut, nur wird die CSS Klasse nicht verarbeitet. Ich nehme an da ich das ganze an ein Objekt "update-targe" übergebe.
Schreibe ich folgende Zeile im HTML um:

alt:

Code:

.html('<div class=test>' + name_text + ' (' + id_text + ')</div>')

neu:

Code:

.html('<div style="float:left; border:1px solid #c0c0c0; margin:10px;">' + name_text + ' (' + id_text + ')</div>')

wid das CSS verarbeitet und richtig ausgegeben.

Kann mir eventuell wer dabei helfen zu verstehen wieso ich dort keine class angeben kann welche dann auch verarbeitet wird?

Danke und Gruss

Brainfish · 29.09.2009, 16:25

Hallo!

Soweit ich das richtig überblicke hast du einen Fehler im CSS Teil und zwar ändere diesen um in:

Code:

.test {
  float:left;
  border:1px
  solid #c0c0c0;
  margin:10px;
}

Für CSS Ids wird #meinecssid verwendet, für Css Klassen .meinecssklasse und für html tags einfach ganz normal.

Sollte trotzdem noch ein Fehler da sein, werde ich mir das heute Abend anschauen.

Talisin · 29.09.2009, 16:52

Oh mein Gott....

Jetzt habe ich 2 Tage den Fehler gesucht in der Übergabe an das Objekt etc. und nicht gesehen das ich beim schnell testen mit CSS die dekleration völlig falsch gesetzt habe.

Natürlich werden IDs mit # und Klassen mit . angesprochen und IDs sind unique etc... zu blöd das ich das übersehen habe :P

Danke dir!

Brainfish · 29.09.2009, 22:04

Habe diese bitterliche Erfahrung auch schon machen müssen. Die kompliziertesten Konstrukte, nur vergessen in CSS eine ID zu vergeben.

Aber aus Fehlern lernt man ja.

29.09.2009, 16:25	#2 (Permalink)
Brainfish Erfahrener Benutzer Registriert: 25.06.2008 Beiträge: 155 WMEc: 6,359 Bedankt: 6 Erhielt 17 Danke für 17 Beiträge	Hallo! Soweit ich das richtig überblicke hast du einen Fehler im CSS Teil und zwar ändere diesen um in: Code: .test { float:left; border:1px solid #c0c0c0; margin:10px; } Für CSS Ids wird #meinecssid verwendet, für Css Klassen .meinecssklasse und für html tags einfach ganz normal. Sollte trotzdem noch ein Fehler da sein, werde ich mir das heute Abend anschauen. __________________ Brain Fish Gedankenbrösel

29.09.2009, 22:04	#4 (Permalink)
Brainfish Erfahrener Benutzer Registriert: 25.06.2008 Beiträge: 155 WMEc: 6,359 Bedankt: 6 Erhielt 17 Danke für 17 Beiträge	Habe diese bitterliche Erfahrung auch schon machen müssen. Die kompliziertesten Konstrukte, nur vergessen in CSS eine ID zu vergeben. Aber aus Fehlern lernt man ja. __________________ Brain Fish Gedankenbrösel

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
[Hilfe] Jquery Tutorials	Brainfish	Sonstige Sprachen	8	21.01.2010 04:30
jQuery Scripte	Jens	Linklisten	0	09.10.2008 12:55

29.09.2009, 16:52	#3 (Permalink)
Talisin Neuer Benutzer Registriert: 29.09.2009 Beiträge: 2 WMEc: 272 Bedankt: 0 Erhielt 0 Danke für 0 Beiträge	Oh mein Gott.... Jetzt habe ich 2 Tage den Fehler gesucht in der Übergabe an das Objekt etc. und nicht gesehen das ich beim schnell testen mit CSS die dekleration völlig falsch gesetzt habe. Natürlich werden IDs mit # und Klassen mit . angesprochen und IDs sind unique etc... zu blöd das ich das übersehen habe :P Danke dir!

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)