html - 如何在 html 文件中输出 xml 内容？

Question

我用 xsl 文件制作了一个 xml 文件，设计很好并且可以正常工作。但是，当我在 html 文件中打开 xml 文件时，我无法弄清楚如何查看我看到的相同内容。我在 html 页面上有一些我想保留的内容，但也包括 xml 文件的内容。这是xml文件的代码：

<?xml version="1.0" ?>
<?xml-stylesheet type="text/xsl" href="menudesign.xsl"?>
<Food>
    <Breakfast>
        <Pancakes>
            <Description>The Best Fluffy Pancakes you will ever fall in love with. One Serving includes 3 pancakes with a square
                         of butter on top and a side of warm maple syrup.</Description>
            <Price>15 AED</Price>
            <Ingredients>Eggs, Flour, Butter, Sugar, Baking Powder</Ingredients>
            <Calories>400</Calories>
        </Pancakes>
    </Breakfast>
    <Breakfast>
        <Eggs>
            <ScrambledEggs>
                <Description Price="10 AED">A customer's review: "These ACTUALLY changed my life. They are amazing!! So creamy. So tasty."
                             Served with 2 slices of toasted white bread and tea</Description>
                <Ingredients>Eggs, Cream, Butter, Thyme</Ingredients>
                <Calories>185</Calories>
            </ScrambledEggs>
        </Eggs>
    </Breakfast>
    <Breakfast>
        <Eggs>
            <SunnySideUp>
                <Description>Who doesn't love the classic Sunny Side Up Eggs? Served with 2 slices of toasted white bread and tea. </Description>
                <Price>8.50 AED</Price>
                <Ingredients>Eggs, Olive Oil</Ingredients>
                <Calories>130</Calories>
            </SunnySideUp>
        </Eggs>
    </Breakfast>
    <MainCourse>
        <Burrito>
            <Description>Seriously satisfying, our Burrito is a soft, warm tortilla wrapped to contain our juicy 
                        chicken with rice and beans topped with sour cream, salsa and Mozarella Cheese. </Description>
            <Price>20 AED</Price>
            <Ingredients>Flour Tortilla, Salsa, Chicken, Tomatoes, Onions, Mozarella Cheese, Beans and Sour Cream</Ingredients>
            <Calories>480</Calories>
        </Burrito>
    </MainCourse>
    <MainCourse>
        <Burger>
            <Description>It's juicy and greasily satisfying. The bun is toasted on the inside and soft outside. 
                         The cheese happily melting over the Chicken. Topped with coleslaw, our special sauce 
                         and pickles. Served with Fries and a Drink of your choice.</Description>
            <Price>30 AED</Price>
            <Ingredients>Bun, Cheddar Cheese, Chicken, Coleslaw, pickles, special sauce</Ingredients>
            <Calories>550</Calories>
        </Burger>
    </MainCourse>
    <MainCourse>
        <Shawarma>
            <MuttonShawarma>
                <Description>Our Mutton shawarma is marinated all day in seasonings and spices like garlic, turmeric, 
                             dried lime, cinnamon, and cardamom, giving it a complex flavor both tangy and warm.</Description>
                <Price>6 AED</Price>
                <Ingredients>Mutton, Fries, Garlic Sauce, Pickles, Parsley</Ingredients>
                <Calories>200</Calories>
            </MuttonShawarma>
        </Shawarma>
    </MainCourse>
    <MainCourse>
        <Shawarma>
            <ChickenShawarma>
                <Description>Our Chicken shawarma has a very unique flavour and cooked to perfection.
                             Marinated in a simple blend of Orange Juice, Garlic, Dried Coriander and 
                             White Pepper. Our Juicy Chicken shawarma will leave you wanting more every time!</Description>
                <Price>5 AED</Price>
                <Ingredients>Chicken, Fries, Hot Sauce, Garlic Sauce, Pickles, Parsley</Ingredients>
                <Calories>220</Calories>
            </ChickenShawarma>
        </Shawarma>
    </MainCourse>
    <Beverages>
        <Juices>
            <Mango>
                <Description>Fresh Mango Juice. With protein, carbohydrates, vitamins A, C, B, E and K present in one glass,
                            we ask ourselves how can something so delicious be so healthy?</Description>
                <Price>10 AED</Price>
                <Ingredients>Mangos</Ingredients>
                <Calories>140</Calories>
            </Mango>
        </Juices>
    </Beverages>
    <Beverages>
        <Juices>
            <Apple>
                <Description>Fresh Apple Juice. Made with a blend of 2 different apples. There's nothing quite like our
                             chilled Apple Juice on a Hot day.</Description>
                <Price>10 AED</Price>
                <Ingredients>Granny Smith Apples, Fuji Apples and Ice</Ingredients>
                <Calories>120</Calories>
            </Apple>
        </Juices>
    </Beverages>
    <Beverages>
        <Fizzy>
            <Sprite>
                <Description>Classic Sprite.</Description>
                <Price>2.5 AED</Price>
                <Ingredients>The main ingredients in Sprite are water, high-fructose corn syrup, and natural lemon and lime flavors. 
                            It also contains citric acid, sodium citrate, and sodium benzoate.</Ingredients>
                <Calories>146</Calories>
            </Sprite>
        </Fizzy>
    </Beverages>
    <Beverages>
        <Fizzy>
            <Coke>
                <Description>Classic Coca Cola</Description>
                <Price>2.5 AED</Price>
                <Ingredients>Carbonated Water, High Fructose Corn Syrup, Caramel Colour, Phosphoric Acid, Natural Flavours and Caffeine</Ingredients>
                <Calories>140</Calories>
            </Coke>
        </Fizzy>
    </Beverages>    
</Food>

XSL 代码：

<?xml version="1.0" ?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/Food">
<html>
<body>
<table align="center" width="700" border="2">
        <tr bgcolor="#00F1F1">
            <th>Breakfast</th>
        </tr>
        <xsl:for-each select="Breakfast/Pancakes">
        <tr>
            <td>Pancakes: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
        <xsl:for-each select="Breakfast/Eggs/ScrambledEggs">
        <tr>
            <td>Scrambled Eggs: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
        <xsl:for-each select="Breakfast/Eggs/SunnySideUp">
        <tr>
            <td>Sunny Side Up: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
</table>
<table align="center" width="700" border="2">
        <tr bgcolor="#00F1F1">
            <th>Main Course</th>
        </tr>
        <xsl:for-each select="MainCourse/Burrito">
        <tr>
            <td>Burrito: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
        <xsl:for-each select="MainCourse/Burger">
        <tr>
            <td>Burger: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
        <xsl:for-each select="MainCourse/Shawarma/MuttonShawarma">
        <tr>
            <td>Mutton Shawarma: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
        <xsl:for-each select="MainCourse/Shawarma/ChickenShawarma">
        <tr>
            <td>Chicken Shawarma: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
<table align="center" width="700" border="2">
        <tr bgcolor="#00F1F1">
            <th>Beverages</th>
        </tr>
        <xsl:for-each select="Beverages/Juices/Mango">
        <tr>
            <td>Mango Juice: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
        <xsl:for-each select="Beverages/Juices/Apple">
        <tr>
            <td>Apple Juice: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
        <xsl:for-each select="Beverages/Fizzy/Sprite">
        <tr>
            <td>Sprite: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
        <xsl:for-each select="Beverages/Fizzy/Coke">
        <tr>
            <td>Coca-Cola: <xsl:value-of select="Description"/>
            <br/>Price: <xsl:value-of select="Price"/>
            <br/>Ingredients: <xsl:value-of select="Ingredients"/>
            <br/>Calories: <xsl:value-of select="Calories"/></td>
        </tr>
        </xsl:for-each>
</table>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>

HTML 文件：

<html>
    <head>
    <style>
    ul {
    position: fixed;
    top: 0;
    width: 100%;
    }
    ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #FDA50F;
    }
    li {
    float: left;
    }
    li a {
    display: block;
    color: white;
    text-align: center;
    padding: 16px 75px;
    text-decoration: none;
    }
    li a:hover:not(.active) {
    background-color: #00868B;
    }

    .active {
    background-color: #4CAF50;
    }
    </style>
        <title> Menu </title>
    </head>
    <body>
    <ul>
    <li><a href="default.asp">Home</a></li>
    <li><a href=main_page.html>Main Page</a></li>
    <li><a href="Deals.asp">Deals</a></li>
    <li><a href="contact.asp">Contact</a></li>
    <li><a href="about.asp">About</a></li>
    </ul>
    </body>
</html>

标签： htmlxmlxslt