Отображение данных из файла XML

Я пытаюсь использовать JavaScript для отображения данных из XML-файла. Мои данные не отображаются на веб-странице, и я не уверен, почему.Отображение данных из файла XML

enter image description here

Любая помощь/советы будут оценены. Мой код отображается ниже.

ПРИМЕЧАНИЕ. У меня нет опыта работы с XML, поэтому имейте в виду, что я совершенно новичок в этом.

<script> 
    var xmlData; 
    function loadXml() { 
     var filename = "CDLibrary.xml"; 
     var XMLhttp = new XMLHttpRequest(); 
     XMLhttp.open("GET", filename, true); 
     var ok = true; 
     try { 
      XMLhttp.send(); 
     } 
     catch(err) { 
      ok = false; 
      alert ("Database not found"); 
     } 
     if (ok) { 
      xmlData = XMLhttp.responseXML; 
      displayXml(xmlData); 
     } 
    } 
    function displayXml() { 
     var CdElements; 
     var CdTitle; 
     var count; 
     CdElements = xmlData.getElementsByTagName("CD"); 
     for (count = 0; count < CdElements.length; count=count+1) { 
      CdTitle = CdElements[count].getElementsByTagName("title"); 
      document.getElementById("output").innerHTML = document.getElementById("output").innerHTML + CdTitle[0].childNodes[0].nodeValue + "</br>"; 
     } 
    } 
</script> 

</head> 

<body> 
    <div> 
     <p id="output"> 
     </p> 
     <p id="buttons"> 
      <input type="button" id="btnDisplay" value="Display CDs" onclick="loadXml();"> 
    </div> 
</body>

источник

2016-10-22 Hudson Mckie

http://www.w3schools.com/xml/tryit.asp?filename=tryajax_xml2 – Mahi

Я попытался использовать это, но просто переключая файл XML и изменять элементы, чтобы быть нечестными не работает. –

1 ==> 'onclick =" loadXml(); "' вместо 'onclick =" displayXml() "' 2 ==> добавить 'displayXml (xmlData)' после 'xmlData = XMLhttp.responseXML;' и test –

<html> 
    <head><title>Import XML Data</title></head> 
    <body> 
     <div> 
      <p id="output"> 
      </p> 
      <p id="buttons"> 
       <input type="button" id="btnDisplay" value="Display CDs" onclick="loadXml()"> 
     </div> 
<script> 
     var xmlData; 
     function loadXml() { 
      var filename = "CDLibary.xml"; 
      var XMLhttp = new XMLHttpRequest(); 
      XMLhttp.open("GET", filename, true); 
      var ok = true; 
      try { 
       XMLhttp.send(); 
      } 
      catch(err) { 
       ok = false; 
       alert ("Database not found"); 
      } 
      if (ok) { 
       xmlData = XMLhttp.responseXML; 
       displayXml(xmlData); 
      } 
     } 
     function displayXml(xmlDataBase) { 
      var CdElements; 
      var CdTitle; 
      var count; 
      CdElements = xmlDataBase.getElementsByTagName("CD"); 
      for (count = 0; count < CdElements.length; count=count+1) { 
       CdTitle = CdElements[count].getElementsByTagName("title"); 
       document.getElementById("output").innerHTML = document.getElementById("output").innerHTML + CdTitle[0].childNodes[0].nodeValue + "</br>"; 
      } 
     } 
    </script> 
    </body> 
    </html>

источник

2016-10-22 16:58:10

У меня такой же код, но он говорит, что база данных не найдена. Это потому, что мой скрипт находится в заголовках, а не в теле? –

Не пытайтесь установить 'XMLhttp.open (" GET ", filename, true);' вместо false –

и файл url должен быть прав и в том же домене –

Вы не используете УАК XMLDATA вместо этого вы будете использовать уаг xmlDataBase. Заменить вам код:

CdElements = xmlData.getElementsByTagName("CD");

И поскольку вы используете глобальные переменные XMLDATA, она доступна внутри функции displayXml, в этом случае нет необходимости в функции displayXml (xmlDataBase), если вы используете функцию displayXml() это будет быть достаточным.

источник

2016-10-22 17:08:33 user1973469

'xmlDataBase' - аргумент не avariable, и это не проблема –

Я сделал изменение, и данные все еще не отображаются. –

Используя ссылку w3schools и меняя информацию и меняя каталог, я получил ее работу. Должна быть ошибка в шаблоне, за которым я слежу, спасибо всем за ваше время и усилия.

<html> 
    <style> 
    table,th,td { 
    border : 1px solid black; 
    border-collapse: collapse; 
    } 
    th,td { 
    padding: 5px; 
    } 
    </style> 
    <body> 


<button type="button" onclick="loadDoc()">Get my CD collection</button> 
<br><br> 
<table id="demo"></table> 

    <script> 
    function loadDoc() { 
    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange = function() { 
    if (this.readyState == 4 && this.status == 200) { 
    myFunction(this); 
    } 
    }; 
    xhttp.open("GET", "CDLibrary.xml", true); 
    xhttp.send(); 
    } 
    function myFunction(xml) { 
    var i; 
    var xmlDoc = xml.responseXML; 
    var table="<tr><th>Artist</th><th>Title</th></tr>"; 
    var x = xmlDoc.getElementsByTagName("CD"); 
    for (i = 0; i <x.length; i++) { 
    table += "<tr><td>" + 
    x[i].getElementsByTagName("performer")[0].childNodes[0].nodeValue + 
    "</td><td>" + 
    x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue + 
    "</td></tr>"; 
    } 
    document.getElementById("demo").innerHTML = table; 
    } 
    </script> 

    </body> 
    </html>

источник

2016-10-22 17:22:21

Отображение данных из файла XML

ответ

Смежные вопросы