is parseXML() able to parser an URL instead of str?

Question

Please check this code , If i am using URL in $.parseXML , the documentElement wontwork.

I am trying to pass this XML file into table. but parseXML wont work if using URL paser.

var xml = $.parseXML("<ExtractSummaryDateSet><_date>2017-09-20</_date><_portfolioSummaries><ExtractSummaryDateSetDetail><_portfolioName>52613661</_portfolioName><_detail><Before>0</Before><After>-329</After><ChangeMaturing>0</ChangeMaturing><ChangeNew>-329</ChangeNew></_detail></ExtractSummaryDateSetDetail><ExtractSummaryDateSetDetail><_portfolioName>52613661_LP</_portfolioName><_detail><Before>0</Before><After>-329</After><ChangeMaturing>0</ChangeMaturing><ChangeNew>-329</ChangeNew></_detail></ExtractSummaryDateSetDetail><ExtractSummaryDateSetDetail><_portfolioName>526136|Total</_portfolioName><_detail><Before>0</Before><After>-329</After><ChangeMaturing>0</ChangeMaturing><ChangeNew>-329</ChangeNew></_detail></ExtractSummaryDateSetDetail></_portfolioSummaries></ExtractSummaryDateSet>");
var extractTableData = function(x){
  var detailField = [];
  detailField.push({});
  detailField[0].title = 'Name';
  detailField[0].values = [];
  for (var i =0; i<x.length; i++){
      detailField[0].values.push(x[i].childNodes[0].innerHTML);
      var detail = x[i].childNodes[1].childNodes;
      for(var j =0 ; j<detail.length; j++){
         var detailf = detailField.find(function(arr){
            return arr.title === detail[j].localName 
         });
        if(!detailf){
         detailField.push({
           'values' : [],
            'title' : null
          });
          detailField[detailField.length -1].values.push(detail[j].innerHTML);
          detailField[detailField.length -1].title = detail[j].localName;
         }
         else{
          detailf.values.push(detail[j].innerHTML);
         }
      }
     }
  return detailField;
};

$(document).ready(function(){
        $("#test1").html(function(i, origText){
          debugger;
          var doc = xml.documentElement;
          var table = "<table>";
          table+= "<tr><th>"+doc.childNodes[0].localName+"</th><td>"+doc.childNodes[0].innerHTML+"</td></tr>"+   
            "<tr><th>"+doc.childNodes[1].localName+"</th><td>_</td>";
          table+="</table>";
         
          table+="<hr>"
          var x = doc.childNodes[1].childNodes;
          var tableData = extractTableData(x);
          table+="<table>"
          for(var i=0; i<tableData.length; i++)
          {
            table+="<tr><th>"+tableData[i].title+"</th>";
             for(var j=0;j<tableData[i].values.length;j++){
               table+="<td>"+tableData[i].values[j]+"</td>"
             }
             table+="</tr>"
          }
          return table+="</table>";
    });   
});

table {  
    color: #333; /* Lighten up font color */
    font-family: Helvetica, Arial, sans-serif; /* Nicer font */
    width: 640px; 
    border-collapse: 
    collapse; border-spacing: 0; 
}

td, th { border: 1px solid #CCC; height: 30px; } /* Make cells a bit taller */

th {  
    background: #F3F3F3; /* Light grey background */
    font-weight: bold; /* Make sure they're bold */
}

td {  
    background: #FAFAFA; /* Lighter grey background */
    text-align: center; /* Center our text */
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<body>
  <div id="test1">Table</div>
</body>

Scenario

Most of the Doc I found in parseXML are using direct import like

var xml = "<rss version='2.0'><channel><title>RSS Title</title></channel></rss>",


xmlDoc = $.parseXML( xml ),

Is it possible to do like

xhttp.open("GET", "URL", true);
var xml = xhttp.responseXML;
xmlDoc = $.parseXML( xml )

I understand the responseXML are not go alone with parseXML, just an example to show the scenario that $.parseXML, is it able to call directly from URL or there are other ways to do it?

Yes, that's possible, although you need to parse the XML *within* the `onreadystate` change event. Alternatively you can use jQuery to get the XML response for you and it will automatically parse it for you. — Rory McCrossan, Oct 04 '17 at 14:24
um, responseXML is already parsed.... You just need to use the XMLHttpRequest object the correct way and read it when the request is done. — epascarello, Oct 04 '17 at 14:25
You could take a look at https://stackoverflow.com/questions/8237923/parsing-xml-rss-from-url-using-java-script — telex-wap, Oct 04 '17 at 14:25
Its quite complex to explain what i am doing. I am trying to put the XML values into a multidimensional table (3 D actually) . so documentElement could extract the length of the attribute and loop. — Fenici, Oct 04 '17 at 14:29
Please check on my code update , if i am trying to change parseXML(URL) , documentElement won't recognise the file ? what should i do to pass the content into parseXML ? — Fenici, Oct 04 '17 at 14:36

score 1 · Answer 1 · answered Oct 04 '17 at 14:47

Since you're already using jQuery, you can use $.get(url, callback) which will perform an Ajax fetch against the URL, then auto-detect XML in the response, and provide a parsed Document object to the callback:

$.get("https://myurl/file.xml", function(xml) {
    // parsed document named `xml` exists in here
});
// parsed document does not exist out here

You will need to restructure your code slightly, since $.parseXML is synchronous and returns its result immediately, whereas network fetches are asynchronous, and provide their value to a callback function called at some future time. If you need help understanding how to restructure to allow an asynchronous Ajax fetch, see How do I return the response from an asynchronous call?

is parseXML() able to parser an URL instead of str?

1 Answers1