頁面加載時從XML文件獲取數據

Question

這是我第一次接觸xml，因此顯而易見的事情並非如此。 我有一個xml文件，我需要使用javascript從文件中檢索數據。 該文件的內容如下：

<?xml version="1.0" encoding="utf-8"?>
<data>
    <Texts>
        <Price><![CDATA[50 $]]></Price>
        <CTA_text><![CDATA[MORE INFORMATION]]></CTA_text>
    </Texts>
</data>

而且我必須在加載時從其中檢索數據到我的html頁面。 所以問題是：如何從xml中獲取50 $和更多信息文本？

Answer 1

嘗試使用javascript XML解析器。 很簡單 這是一個例子： http : //www.w3schools.com/xml/dom_intro.asp

<script>
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
            myFunction(xhttp);
        }
    };
    xhttp.open("GET", "books.xml", true);
    xhttp.send();

    function myFunction(xml) {
        var xmlDoc = xml.responseXML;
        document.getElementById("demo").innerHTML =
        xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;
    }
</script>

Answer 2

您可以使用XMLHttpRequest() ， DOMParser() for循環，遞歸以迭代xml document所有節點，檢查節點的.nodeType是否為4 ，使用CDATASection .textContent屬性檢索節點的文本內容。

<!DOCTYPE html>
<html>    
  <head>
    <script>
      function iterateNodes(nodes) {
        for (var i = 0; i < nodes.length; i++) {
          if (nodes[i].nodeType === 4) {
            document.body.innerHTML += nodes[i].textContent + "<br>"
          };
            if (nodes[i].childNodes.length) {
              iterateNodes(nodes[i].childNodes)
            }
          }
      }
      window.addEventListener("load", function() {           
        var request = new XMLHttpRequest();
        request.addEventListener("load", function() {
          var parser = new DOMParser(); 
          var xml = parser.parseFromString( this.response, "text/xml" )
          var nodes = xml.documentElement.childNodes;
          iterateNodes(nodes)              
        });
        request.open("GET", "data.xml");
        request.send();
      })
    </script>
  </head>    
  <body>      
  </body>    
</html>

plnkr http://plnkr.co/edit/gEZCWeHTwzk7o1GSAqzJ?p=preview

頁面加載時從XML文件獲取數據

問題描述

2 個解決方案

解決方案1
1 2016-06-30 18:48:19

解決方案2
1 已采納 2016-06-30 19:07:49

頁面加載時從XML文件獲取數據

問題描述

2 個解決方案

解決方案1 1 2016-06-30 18:48:19

解決方案2 1 已采納 2016-06-30 19:07:49

解決方案1
1 2016-06-30 18:48:19

解決方案2
1 已采納 2016-06-30 19:07:49