Harjutus 8 | XML faili kuvamine js lehel

XML – Extensible Markup Language

index.mjs

function loadXMLDoc() {
  let xmlhttp = new XMLHttpRequest(); //uus päring
  xmlhttp.onreadystatechange = function () {
    if (this.readyState === 4 && this.status === 200) {
      //статус запроса выполнен
      getGameDetails(this);
    }
  };
  xmlhttp.open("GET", "src/games.xml", true); //ava xml fail
  xmlhttp.send();
}

function getGameDetails(xml) {
  //saame andmed xml failis
  const xmlDoc = xml.responseXML;
  let tableRows = "<tr><th>Title</th><th>Price</th><th>Platforms</th></tr>"; //on liisatud andmet tüübid
  let gameElements = xmlDoc.getElementsByTagName("game"); //
  for (let i = 0; i < gameElements.length; i++) {
    tableRows += //tsüükli loomine
      "<tr><td>" +
      gameElements[i].getElementsByTagName("title")[0].childNodes[0].nodeValue +
      "</td><td>" +
      gameElements[i].getElementsByTagName("price")[0].childNodes[0].nodeValue +
      "</td><td>";
    let platforms = gameElements[i].getElementsByTagName("platform");
    for (let j = 0; j < platforms.length; j++) {
      //tsüükli loomine
      tableRows += platforms[j].childNodes[0].nodeValue + "/";
    }
    tableRows += "</td></tr>";
  }
  document.getElementById("xmlTable").innerHTML = tableRows;
}

document.getElementById("app").innerHTML = `<table id="xmlTable"></table>`;

loadXMLDoc();

games.xml

<?xml version="1.0" encoding="UTF-8"?>
<gamelist>
    <game>
        <title lang="en">Hearthstone</title>
        <price>Free</price>
        <platforms>
            <platform>pc</platform>
            <platform>ios</platform>
        </platforms>
    </game>
    <game>
        <title lang="en">Minecraft</title>
        <price>15.99</price>
        <platforms>
            <platform>xbox</platform>
            <platform>pc</platform>
            <platform>mobile</platform>
        </platforms>
    </game>
    <game>
        <title lang="en">Dota 2</title>
        <price>life</price>
        <platforms>
            <platform>PC</platform>
            <platform>android</platform>
        </platforms>
    </game>
</gamelist>