xml-parsing

xml parsing and modify

by Gaetano Piazzolla

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<body>
  <div id="test1">Table</div>
  <button id="btn1">Extract data Table</button>
</body>

CSS

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 */
}

JavaScript

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 extractDetail = function(detail) {
  var table = "";
  var detailChild = detail.childNodes;
  for (var i = 0; i < detailChild.length; i++) {
    table += "<tr><th>" + detailChild[i].localName + "</th><td>" + detailChild[i].innerHTML + "</td></tr>";
  }
  return table;
};

var extractTableData = function(summaries) {
  var detailField = [];
  detailField.push({});
  detailField[0].title = 'Name';
  detailField[0].values = [];
  for (var i = 0; i < summaries.length; i++) {
    detailField[0].values.push(summaries[i].childNodes[0].innerHTML);
    var detail = summaries[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() {
  $("#btn1").click(function() {
 ...