在 JavaScript 中解析嵌套的 XML 矩阵答案

【问题标题】：Parse a nested XML matrix in JavaScript在 JavaScript 中解析嵌套的 XML 矩阵
【发布时间】：2020-12-26 15:22:18
【问题描述】：

我将解析以下 xml 文件并打印 html 文件中的每个值，同时让它们按标签进行组织，最好输出看起来像菜单格式，但如果对解析逻辑有帮助，将不胜感激。

<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>

所以输出应该按膳食类型划分，即晚餐、早餐、甜点。它还应该在商品名称旁边显示商品的价格

【问题讨论】：

标签： javascript html xml

【解决方案1】：

看看 DOM-Parser：https://developer.mozilla.org/en-US/docs/Web/API/DOMParser

您需要使用递归并将其解析为 JSON 对象。

这应该对你有很大帮助，它详细描述了整个过程，代码：https://medium.com/@nitinpatel_20236/converting-xml-to-json-using-recursion-7b1df91b42d8

【讨论】：