Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    May 2017
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Need Help ! Retrieve data from xml file using javascript

    Hi,

    I am very new to xml and javascript. I have an xml file which is coming from a RSS feed. I need to create an AJAX webpage to retrieve the "title" and "description" contained in the "item" elements of the xml file. The xml file can be downloaded from this link Fil de presse - Le Devoir (I also added a small part of the xml file below to give you an idea of what it looks like).

    ***We can assume that the "title" and "description" are containing text only (no html) and it is not necessary to use try-catch.***


    So far, here my javascript. It works well to retrieve the titles but I am not sure how to get the description to show underneath each title. Please keep it simple in your answers as I am a beginner. No advanced coding please. Thank you !



    Code:
    <?xml version="1.0" encoding="ISO-8859-1" ?>
        <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
    
        <title> </title>
    
        <script language="JavaScript">
    
    
        function chargeDocument(URI) {
        try {
     
         xmlhttp = new XMLHttpRequest();
         xmlhttp.open("GET", URI,true);
         xmlhttp.onreadystatechange=function() {
         if (xmlhttp.readyState==4) {
         displaytitles(xmlhttp.responseXML);
        }
        }
        xmlhttp.send(null);
         } catch(o) {alert(o);}
        }
    
    
        function displaytitles(doc) {
          titles = doc.getElementsByTagName("title");
          elementol = document.createElement("ol");
          var length1 = titles.length;
          for ( k = 0; k &lt; length1 ; ++k) {
            elementli = document.createElement("li");
            elementli.appendChild(
              document.createTextNode(
                titles[k].firstChild.nodeValue
              )
            );
            elementol.appendChild(elementli);
          }
          body = document.getElementsByTagName("body").item(0);
          body.appendChild(elementol);
        }
        </script>
        </head>
        <body>
        <ul>
        <li><a href="javascript:chargeDocument('edition_complete.xml');">Retrieve  
        and display rss news.</a></li>
        </ul>
        </body>
        </html>

    The script above works well. However I tried several things to retrieve the description for each title but it's not working. Here is one of the thing I tried :


    Code:
     function displayTitles(doc) {
          titles = doc.getElementsByTagName("title");
          elementol = document.createElement("ol");
          var length1 = titles.length;
         
    	 for ( k = 0; k &lt; length1 ; ++k) {
            elementli = document.createElement("li");
            elementli.appendChild(
              document.createTextNode(
                titles[k].firstChild.nodeValue
              )
            );
            elementol.appendChild(elementli);
    		descriptions = doc.getElementsByTagName("description");
    	    var length2 = descriptions.length;
    		
    			for ( j = 0; j &lt; length2 ; ++j) {
    			elementp = document.createElement("p");
    			elementp.appendChild(
    			document.createTextNode(
                descriptions[j].firstChild.nodeValue
              )
            );
            elementli.appendChild(elementp);
    		}
          }
          body = document.getElementsByTagName("body").item(0);
          body.appendChild(elementol);
        }

    Here is a small part for my xml file (to get the whole file go here Fil de presse - Le Devoir ) :


    Code:
    <channel>
        <title>Fil de presse - Le Devoir</title>
        <link>http://www.ledevoir.com</link>
        <language>fr-ca</language>
        <copyright>Copyright 2008-2009, Le Devoir</copyright>
    
        <webMaster>[email protected] (Le Devoir)</webMaster>
        <ttl>1440</ttl>
        <image>
    	 <url>http://www.ledevoir.com/images/ul/logos/logo_devoir.png</url>
    	 <title>Fil de presse - Le Devoir</title>
    	 <link>http://www.ledevoir.com</link>
    	</image>
    
    	<description></description>
        <category>Fil de presse</category>
    
    		
        <item>
    	  <surtitle>Italie</surtitle>
          <title>Matteo Renzi est réélu à la tête du Parti démocrate</title>
          <pubDate>Sun, 30 Apr 2017 20:06:00 -0400</pubDate>
          <link>http://www.ledevoir.com/international/europe/497681/italie-matteo-renzi-est-reelu-a-la-tete-du-parti-democrate</link>
          <guid>http://www.ledevoir.com/international/europe/497681/italie-matteo-renzi-est-reelu-a-la-tete-du-parti-democrate</guid>
          <category>Europe</category>
          <description>L’ancien chef du gouvernement Matteo Renzi a repris dimanche la tête du Parti démocrate (PD,...</description>
          <author>[email protected] (Ljubomir Milasin)</author>
        </item>
    
    		
        <item>
    	  <surtitle></surtitle>
          <title>Rafael Nadal décroche un dixième titre à Barcelone</title>
          <pubDate>Sun, 30 Apr 2017 19:46:22 -0400</pubDate>
          <link>http://www.ledevoir.com/sports/tennis/497654/rafael-nadal-decroche-un-dixieme-titre-a-barcelone</link>
          <guid>http://www.ledevoir.com/sports/tennis/497654/rafael-nadal-decroche-un-dixieme-titre-a-barcelone</guid>
          <category>Tennis</category>
          <description>L’Espagnol a balayé en finale l’Autrichien Dominic Thiem (6-4, 6-1) en une heure et 30 minutes pour décrocher le 71e titre de sa carrière.</description>
          <author>[email protected] (Agence France-Presse)</author>
        </item>
    
    		
        <item>
    	  <surtitle></surtitle>
          <title>Le pont Honoré-Mercier aura une nouvelle structure </title>
          <pubDate>Sun, 30 Apr 2017 18:57:01 -0400</pubDate>
          <link>http://www.ledevoir.com/politique/montreal/497663/le-pont-honore-mercier-aura-une-nouvelle-structure-en-direction-de-la-rive-sud</link>
          <guid>http://www.ledevoir.com/politique/montreal/497663/le-pont-honore-mercier-aura-une-nouvelle-structure-en-direction-de-la-rive-sud</guid>
          <category>Montréal</category>
          <description>Le pont Honoré-Mercier, qui relie le territoire mohawk de Kahnawake sur la rive-sud à l’arrondissement LaSalle sur l’île de Montréal, aura une nouvelle structure en direction de la Rve-Sud.</description>
          <author>[email protected] (Vicky Fragasso-Marquis)</author>
        </item>

  2. #2
    Regular Coder
    Join Date
    Feb 2016
    Posts
    906
    Thanks
    0
    Thanked 187 Times in 185 Posts
    Please don't crosspost. Stick to your thread at Web Developer Forum.


 

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •