Javascript 将json数据发送到具有多个标头的表
我很难理解如何完成这件事 我有一个带有餐馆菜单卡的json文件，我想把这些数据放到一个表中，但因为它是菜单卡，所以它有多个标题（比如“开胃菜”、“主菜”、“威士忌”等等）。它只包含每个对象的名称和价格 解析json不是一个问题，更重要的是将它塑造成一个表 这是我的json：Javascript 将json数据发送到具有多个标头的表,javascript,json,Javascript,Json,我很难理解如何完成这件事 我有一个带有餐馆菜单卡的json文件，我想把这些数据放到一个表中，但因为它是菜单卡，所以它有多个标题（比如“开胃菜”、“主菜”、“威士忌”等等）。它只包含每个对象的名称和价格 解析json不是一个问题，更重要的是将它塑造成一个表 这是我的json： { "Drinks": [ { "Beers vessel": [ { "Name": "Jupiler / 33cl / 50cl"
{
"Drinks": [
{
"Beers vessel": [
{
"Name": "Jupiler / 33cl / 50cl"
"Price": "2.00 / 2.60 / 4.00"
},
{
"Name": "Bruges Zot blond"
"Price": "3.50"
},
{
"Name": "extra tap Crescent"
"Price": "4:30"
},
{
"Name": "extra tap"
"Price": ""
}
],
"Beers Bottle": [
{
"Name": "Brugze Zot brown"
"Price": "3.50"
},
{
"Name": "Tall Hendrik Tripel"
"Price": "4.30"
},
{
"Name": "Tall Hendrik Quadruppel"
"Price": "4:30"
},
{
"Name": "Westmalle Dubbel"
"Price": "3.50"
},
{
"Name": "Westmalle Tripel"
"Price": "4:10"
},
{
"Name": "Duvel"
"Price": "3.90"
},
{
"Name": "Lindemans Kriek 25cl"
"Price": "3.50"
},
{
"Name": "Duchesse de Bourgogne"
"Price": "3.50"
},
{
"Name": "Hommelbier"
"Price": "2.90"
},
{
"Name": "Rochefort 10"
"Price": "4:30"
},
{
"Name": "Chimay Tripel white"
"Price": "3.90"
},
{
"Name": "Chimay blue"
"Price": "4:30"
},
{
"Name": "Orval"
"Price": "4:30"
},
{
"Name": "St. Bernard Abbot"
"Price": "4:30"
},
{
"Name": "Kriek Boon 37,5cl"
"Price": "7:20"
},
{
"Name": "Boon Geuze 37,5cl"
"Price": "7:20"
},
{
"Name": "Jupiler NA"
"Price": "2:00"
},
{
"Name": "Hoegaarden"
"Price": "2:30"
},
{
"Name": "Rodenbach"
"Price": "2:30"
}
],
"Soft drinks": [
{
"Name": "Coca Cola / light / zero"
"Price": "2.20"
},
{
"Name": "Ice Tea"
"Price": "2.20"
},
{
"Name": "Perrier 20cl"
"Price": "2.20"
},
{
"Name": "Vittel 25cl / 50cl"
"Price": "2:20 / 4:40"
},
{
"Name": "San Pellegrino 50cl"
"Price": "4:40"
},
{
"Name": "Fanta Orange"
"Price": "2.20"
},
{
"Name": "Sprite"
"Price": "2.20"
},
{
"Name": "Gini"
"Price": "2.20"
},
{
"Name": "Schweppes Tonic"
"Price": "2.20"
},
{
"Name": "Schweppes Agrum"
"Price": "2.20"
},
{
"Name": "Tönisteiner Orange"
"Price": "2.20"
},
{
"Name": "Squash (tonic + grapefruit)"
"Price": "4:40"
},
{
"Name": "Tennis (tonic + orange)"
"Price": "4:40"
},
{
"Name": "Fristi"
"Price": "2.20"
},
{
"Name": "Cecemel"
"Price": "2.20"
},
{
"Name": "Cold milk"
"Price": "2.20"
},
{
"Name": "Red Bull"
"Price": "3.50"
}
],
"Fruit": [
{
"Name": "Apple Juice"
"Price": "2:30"
},
{
"Name": "Orange Juice"
"Price": "2:30"
},
{
"Name": "Grapefruit"
"Price": "2:30"
},
{
"Name": "Multi Juice"
"Price": "2:30"
},
{
"Name": "Fresh orange juice"
"Price": "7.00"
},
{
"Name": "Fresh lemon juice"
"Price": "7.00"
},
{
"Name": "Lemon squash"
"Price": "8:00"
}
],
"Cocktails": [
{
"Name": "Mojito"
"Price": "8:00"
},
{
"Name": "Caipirinha"
"Price": "8:00"
},
{
"Name": "Tequila Sunrise"
"Price": "7:20"
},
{
"Name": "Cuba Libre"
"Price": "7:20"
}
],
"Children Cocktails": [
{
"Name": "Dragon Blood"
"Price": "2.50"
},
{
"Name": "Green Potion"
"Price": "2.50"
},
{
"Name": "Smurfs Cocktail"
"Price": "2.50"
}
],
"Appetizers": [
{
"Name": "Sangria fresh fruit"
"Price": "8:40"
},
{
"Name": "Campari fresh fruit"
"Price": "8:50"
},
{
"Name": "Sherru fino"
"Price": "4:10"
},
{
"Name": "Pineau des Charentes"
"Price": "4:10"
},
{
"Name": "Kir"
"Price": "4:20"
},
{
"Name": "Ricard"
"Price": "4.00"
},
{
"Name": "Martini white / red / rosado / fiero"
"Price": "4:50"
},
{
"Name": "Martini Royal (Cava)"
"Price": "6:50"
},
{
"Name": "Aperol Spritz"
"Price": "6:50"
},
{
"Name": "Picon vin blac"
"Price": "7.00"
},
{
"Name": "Glass of Cava"
"Price": "5:00"
},
{
"Name": "Bottle of Cava"
"Price": "25.00"
},
{
"Name": "Piper Heidsieck Champagne 75cl"
"Price": "70.00"
},
{
"Name": "Champagne Pommery Brut 37,5cl"
"Price": "35.00"
}
],
"Spirits":
[
{
"Name": "Cognac"
"Price": "7.00"
},
{
"Name": "Grand Marnier"
"Price": "6:00"
},
{
"Name": "Cointreau"
"Price": "6:00"
},
{
"Name": "Amaretto Disaronno"
"Price": "5:00"
},
{
"Name": "Gin Mare"
"Price": "10.00"
},
{
"Name": "Hendrick's Gin"
"Price": "10.00"
},
{
"Name": "Gin Bombay Sapphire"
"Price": "6:00"
},
{
"Name": "Gin Monkey 47"
"Price": "10.00"
},
{
"Name": "Vodka Russian Standard"
"Price": "5:00"
},
{
"Name": "Vodka Red Bull"
"Price": "7:50"
},
{
"Name": "Tequila Patron Silver"
"Price": "8:00"
},
{
"Name": "Bacardi Blanco"
"Price": "5:00"
},
{
"Name": "Havana 7"
"Price": "6:00"
},
{
"Name": "Sambuca"
"Price": "5:00"
},
{
"Name": "Baileys"
"Price": "5:00"
},
{
"Name": "Limoncello"
"Price": "4.00"
},
{
"Name": "Jägermeister"
"Price": "4.00"
},
{
"Name": "Gin Harrier"
"Price": "4.00"
},
{
"Name": "Korenwijn Harrier"
"Price": "5:00"
},
{
"Name": "Supplement soda"
"Price": "2.20"
}
],
"Whiskey": [
{
"Blended Whiskey": [
{
"Name": "J & B"
"Price": "5:00"
},
{
"Name": "Johnnie Walker"
"Price": "5:00"
},
{
"Name": "Jameson"
"Price": "5:00"
}
],
"Malt Whisky": [
{
"Name": "The Macallan 12 years"
"Price": "9:00"
},
{
"Name": "Lagavullin 16 years"
"Price": "9:00"
},
{
"Name": "Talisker 10 years"
"Price": "9:00"
}
],
"American Whiskey": [
{
"Name": "Jack Daniels"
"Price": "5:00"
}
],
"Name": "Supplement soda"
"Price": "2:00"
}
],
"House Wine": [
{
"White": [
{
"Name", "glass"
"Price": "3.90"
},
{
"Name": "carafe 25cl / 50cl"
"Price": "7:30 / 14:40"
},
{
"Name": "bottle 75cl"
"Price": "22:50"
}
],
"Red": [
{
"Name", "glass"
"Price": "3.90"
},
{
"Name": "carafe 25cl / 50cl"
"Price": "7:30 / 14:40"
},
{
"Name": "bottle 75cl"
"Price": "22:50"
}
],
"Rose": [
{
"Name", "glass"
"Price": "3.90"
},
{
"Name": "carafe 25cl / 50cl"
"Price": "7:30 / 14:40"
},
{
"Name": "bottle 75cl"
"Price": "22:50"
}
],
"Chardonnay": [
{
"Name", "glass"
"Price": "4:50"
},
{
"Name": "carafe 25cl / 50cl"
"Price": "9:10 / 16.90"
},
{
"Name": "bottle 75cl"
"Price": "23.90"
}
],
"Semi-Sweet Wine": [
{
"Name", "glass"
"Price": "4:40"
},
{
"Name": "carafe 25cl / 50cl"
"Price": "8:10 / 16.90"
},
{
"Name": "bottle 75cl"
"Price": "22.90"
}
]
}
],
"Wine Suggestions": [
{
"White": [
{
"Name": "Sancerre (Sauvignon Blanc) Dom Brochard"
"Price": "27.00"
},
{
"Name": "Santa Gloria Reserva (Chardonnay) Chile"
"Price": "19:00"
},
{
"Name": "Candela 1884 (Viognier) Argentina"
"Price": "24.50"
},
{
"Name": "Muscle (Chenin Blanc) South Africa",
"Price": "22:50"
},
{
"Name": "Chateau des Gravieres (Semillon / Sauvignon)"
"Price": "20:50"
}
],
"Red": [
{
"Name": "Cotes du Rhone Rasteau Labartalas 2011,"
"Price": "26.00"
},
{
"Name": "Santa Gloria Reserva (Carmenere) Chile"
"Price": "24.00"
},
{
"Name": "Candela 1884 (Malbec) Argentina"
"Price": "24.50"
},
{
"Name": "Beaujolais Villages Pardon"
"Price": "21:50"
}
]
}
],
"Hot Drinks": [
{
"Name": "Coffee"
"Price": "2.50"
},
{
"Name": "Small Coffee"
"Price": "2.50"
},
{
"Name": "Decaf"
"Price": "2.50"
},
{
"Name": "Cappuccino (whipped cream),"
"Price": "3.60"
},
{
"Name": "Lait Russe"
"Price": "3:10"
},
{
"Name": "Hot Chocolate (with Callebaut)"
"Price": "3.50"
},
{
"Name": "Warm milk"
"Price": "2.50"
},
{
"Name": "Glühwein"
"Price": "6:00"
},
{
"Name": "Irish Coffee"
"Price": "7:50"
},
{
"Name": "French Coffee (cognac)"
"Price": "7:50"
},
{
"Name": "Grand Marnier coffee"
"Price": "7:50"
},
{
"Name": "Amaretto coffee"
"Price": "7:50"
},
{
"Name": "Tea sachet"
"Price": "2.50"
},
{
"Name": "Loose tea"
"Price": "3:30"
},
{
"Name": "Infusion mint / orchard"
"Price": "3:30"
}
]
}
],
"To Eat": [
{
"Starters": [
{
"Name": "Soup"
"Price": "5:00"
},
{
"Name": "Shrimp croquettes (4 pieces) with salad"
"Price": "12:50"
}
],
"Main Dishes": [
{
"Name": "Steak (with fries and salad),"
"Subtext": "Nature, béarnaise, mushroom or pepper sauce"
"Price": "22.70"
},
{
"Name": "Stew with Bruges Zot (fries and salad),"
"Price": "19:50"
},
{
"Name": "Steak tartare"
"Price": "18.70"
},
{
"Name": "Hamburger"
"Price": "18.70"
},
{
"Name": "Soles (3 pieces)"
"Price": "23:50"
}
],
"Small Dishes": [
{
"Name": "Mixed plate with:"
"Subtext": "Salame di Felino, mozzarella balls, sundried tomatoes, cheese cubes, bread and butter."
"Price": "16:50"
},
{
"Name": "Mixed plate (above) with fried snacks"
"Price": "22:50"
},
{
"Name": "Assorted fried snacks"
"Price": "13.80"
},
{
"Name": "Deep-fried squid rings"
"Price": "6.80"
},
{
"Name": "Bruschetta (6 pieces)"
"Price": "9:00"
},
{
"Name": "Garlicbread (6 pieces)"
"Price": "6:00"
},
{
"Name": "Serving cheese cubes"
"Price": "7:50"
},
{
"Name": "Serving Salami"
"Price": "8:50"
},
{
"Name": "Serving mixed"
"Price": "8.70"
}
],
"Pasta dishes": [
{
"Name": "Vegetarian spaghetti"
"Price": "12:50"
},
{
"Name": "Spaghetti"
"Price": "12:50"
},
{
"Name": "Children Spaghetti"
"Price": "7.80"
},
{
"Name": "Penne Arabiata"
"Price": "12:50"
},
{
"Name": "Chili con carne"
"Price": "12:50"
}
],
"Salads": [
{
"Name": "Goat Cheese Salad"
"Price": "17:50"
},
{
"Name": "Salad shrimp croquettes"
"Price": "17:50"
},
{
"Name": "Chicken Salad"
"Price": "18:20"
},
{
"Name": "Salad with chicken, fresh pineapple"
"Price": "19:20"
},
{
"Name": "Salmon Salad"
"Price": "19:20"
},
{
"Name": "Cold pasta salad with chicken"
"Price": "17.90"
},
{
"Name": "Cold pasta salad with salmon"
"Price": "18.90"
}
],
"Desserts": [
{
"Name": "Sabayon with fresh fruit and ice cream"
"Price": "12.00, 9:50 from 2 persons"
},
{
"Name": "Tiramisu"
"Price": "5:00"
},
{
"Name": "creme brulee"
"Price": "6:00"
}
],
"Tea Room": [
{
"Subtext": "14:30 to 17:30"
},
{
"Ice": [
{
"Name": "Children's ice cream"
"Price": "3.80"
},
{
"Name": "Dame blanche"
"Price": "8.60"
},
{
"Name": "Icecream with Strawberry"
"Price": "10.60"
},
{
"Name": "Icecream with fresh fruit"
"Price": "10.60"
},
{
"Name": "whipped cream"
"Price": "1:00"
}
],
"Pancakes / Waffles": [
{
"Name": "Sugar"
"Price": "4.00"
},
{
"Name": "butter"
"Price": "4:20"
},
{
"Name": "cream"
"Price": "5:00"
},
{
"Name": "chocolate"
"Price": "5:50"
},
{
"Name": "Mikado"
"Price": "7.50"
},
{
"Name": "fresh fruit"
"Price": "10.60"
},
{
"Name": "fresh fruit / ice cream / whipped cream"
"Price": "12.60"
}
]
}
]
}
]
}
谢谢也许你可以尝试以下简单的方法：
<?php
$json = file_get_contents('json.json');
$data = json_decode($json, true);
?>
<table cellspacing="0" cellpadding="10" style="border:1px solid #DDD" width="50%">
<?php foreach($data as $cat_name => $category): ?>
<tr style="background:#DDD"><td colspan="2"><?php echo $cat_name ?></td></tr>
<?php foreach($category as $sub_category): ?>
<?php foreach($sub_category as $entry_name => $entry): ?>
<tr style="background:#EEE"><td style="padding-left:25px" colspan="2"><?php echo $entry_name ?></td></tr>
<?php foreach($entry as $e): ?>
<tr>
<td style="padding-left:35px"><?php echo isset($e['Name']) ? $e['Name'] : '' ?></td>
<td style="padding-left:35px"><?php echo isset($e['Price']) ? $e['Price'] : '' ?></td>
</tr>
<?php endforeach; ?>
<?php endforeach; ?>
<?php endforeach; ?>
<?php endforeach; ?>
</table>