时间戳

首页 > 解决方案 > 使用外部 XML 文件在 JavaScript 中解析 xml

javascript - 使用外部 XML 文件在 JavaScript 中解析 xml

问题描述

我正在尝试在 JavaScript 中解析 XML 文档，但收到 TypeError: xmlDoc.getElementsByTagName(...)[0] is undefined。我想确保正确解析 XML。

这是我加载外部 XML 的函数：

function loadXML(callback) {   

        var xobj = new XMLHttpRequest();
            xobj.overrideMimeType("application/xml");
        xobj.open('GET', 'restaurant_menu.xml', true); 
        xobj.onreadystatechange = function () {
              if (xobj.readyState == 4 && xobj.status == "200") {
                // Required use of an anonymous callback as .open will NOT return a value but simply returns undefined in asynchronous mode
                callback(xobj.responseText);
              }
        };
        xobj.send(null);  
}

然后我在这个 JavaScript 函数中加载解析 XML：

function showBreakfast() {

  loadXML(function(response) {
        parser = new DOMParser();
        xmlDoc = parser.parseFromString(response, "text/xml");

        document.getElementById("breakfast").innerHTML = xmlDoc.getElementsByTagName("Name")[0].childNodes[0].nodeValue;
    });

}

但我收到一个 TypeError。我是否正确解析了 XML？这是我的 XML 文档。我不应该在我的节目早餐功能中收到“水果碗”吗？

<?xml version="1.0" encoding="UTF-8"?>
<MENU>
  <BREAKFAST>
    <APPETIZER><NAME>Fruit Bowl</NAME><PRICE>10.90</PRICE></APPETIZER>
    <SALAD><NAME>Caeser SALAD</NAME><PRICE>3.90</PRICE></SALAD>
    <SOUP><NAME>Chicken Noodle</NAME><PRICE>5.90</PRICE></SOUP>
    <ANTREE><NAME>Omelet</NAME><PRICE>20.90</PRICE></ANTREE>
    <ANTREE><NAME>Scrambled Eggs</NAME><PRICE>20.90</PRICE></ANTREE>
    <DESSERT><NAME>Apple Pie</NAME><PRICE>7.90</PRICE></DESSERT>
  </BREAKFAST>
  <BRUNCH>
    <APPETIZER><NAME>Fruit Bowl</NAME><PRICE>10.90</PRICE></APPETIZER>
    <APPETIZER><NAME>EggPlant Frits</NAME><PRICE>10.90</PRICE></APPETIZER>
    <SALAD><NAME>House Salad</NAME><PRICE>3.90</PRICE></SALAD>
    <SOUP><NAME>Chicken Noodle</NAME><PRICE>5.90</PRICE></SOUP>
    <ANTREE><NAME>French Toast</NAME><PRICE>20.90</PRICE></ANTREE>
    <ANTREE><NAME>Omelet</NAME><PRICE>20.90</PRICE></ANTREE>
    <ANTREE><NAME>Scrambled Eggs</NAME><PRICE>20.90</PRICE></ANTREE>
    <ANTREE><NAME>Hamburg</NAME><PRICE>20.90</PRICE></ANTREE>
    <DESSERT><NAME>Apple Pie</NAME><PRICE>7.90</PRICE></DESSERT>
  </BRUNCH>
  <LUNCH>
    <APPETIZER><NAME>Calamari</NAME><PRICE>10.90</PRICE></APPETIZER>
    <SALAD>Caeser Salad<PRICE>3.90</PRICE></SALAD>
    <SALAD><NAME>Arugula Salad</NAME><PRICE>3.90</PRICE></SALAD>
    <SOUP><NAME>Chicken Noodle</NAME><PRICE>5.90</PRICE></SOUP>
    <SOUP><NAME>Italian Wedding Soup</NAME><PRICE>5.90</PRICE></SOUP>
    <ANTREE><NAME>Steak</NAME><PRICE>20.90</PRICE></ANTREE>
    <ANTREE><NAME>Hamburg</NAME><PRICE>20.90</PRICE></ANTREE>
    <ANTREE><NAME>Angel Hair Pasta</NAME><PRICE>20.90</PRICE></ANTREE>
    <DESSERT><NAME>Tiramisu</NAME><PRICE>7.90</PRICE></DESSERT>
  </LUNCH>
  <DINNER>
    <APPETIZER><NAME>Calamari</NAME><PRICE>10.90</PRICE></APPETIZER>
    <APPETIZER><NAME>EggPlant Frits</NAME><PRICE>10.90</PRICE></APPETIZER>
    <SALAD>House Salad<PRICE>3.90</PRICE></SALAD>
    <SALAD><NAME>Caeser Salad</NAME><PRICE>3.90</PRICE></SALAD>
    <SOUP>Chicken Noodle<PRICE>5.90</PRICE></SOUP>
    <SOUP><NAME>Italian Wedding Soup</NAME><PRICE>5.90</PRICE></SOUP>
    <SOUP><NAME>Roasted Patato</NAME><PRICE>5.90</PRICE></SOUP>
    <ANTREE><NAME>Steak</NAME><PRICE>20.90</PRICE></ANTREE>
    <ANTREE><NAME>Hamburg</NAME><PRICE>20.90</PRICE></ANTREE>
    <ANTREE><NAME>Angel Hair Pasta</NAME><PRICE>20.90</PRICE></ANTREE>
    <ANTREE><NAME>Roasted Duck</NAME><PRICE>20.90</PRICE></ANTREE>
    <DESSERT><NAME>Apple Pie</NAME><PRICE>7.90</PRICE></DESSERT>
    <DESSERT><NAME>Tiramisu</NAME><PRICE>7.90</PRICE></DESSERT>
    <DESSERT><NAME>Creme Brule</NAME><PRICE>7.90</PRICE></DESSERT>
  </DINNER>
  <DRINKS>
    <BEER><NAME>Bud Weiser</NAME><PRICE>5.90</PRICE></BEER>
    <BEER><NAME>Hefe Weissbier</NAME><PRICE>6.90</PRICE></BEER>
    <WINE><NAME>Cabernet Sauvignon</NAME><FROM>Napa Valley</FROM><PRICE>15.90</PRICE></WINE>
    <WINE><NAME>Margaux</NAME><PRICE>50.90</PRICE></WINE>
    <WINE><NAME>Pinot Noir</NAME><FROM>Napa Valley</FROM><PRICE>12.90</PRICE></WINE>
    <WINE><NAME>Chianti</NAME><PRICE>10.90</PRICE></WINE>
    <COFFEE><NAME>Star Bucks</NAME><PRICE>3.90</PRICE></COFFEE>
    <SODA>Coca Cola<PRICE>3.90</PRICE></SODA>
    <SODA>Sprite<PRICE>3.90</PRICE></SODA>
  </DRINKS>
</MENU>

标签： javascripthtmlxml

解决方案

你说xmlDoc.getElementsByTagName("Name")，但你的 XML 没有<Name>元素。它返回一个长度为零的节点列表。然后，您尝试读取该childNodes列表中的第一项，但由于没有，您会收到错误消息。

XML确实有<NAME>元素。XML 区分大小写。

推荐阅读