因此，我尝试将我的商店对象销售的每个类别的商品打印到 JavaScript 中的 HTML 文件中。当我尝试在下面这样做时，它似乎没有打印任何内容，我想知道是否有人可以告诉我我做错了什么。
我希望它打印出来:
冰淇淋
蛋糕
let dessert = {
store: "Baskin Robbins",
inventory: {
"Ice cream": {
0: {
flavor: "Chocolate",
cost: 15
},
1: {
flavor: "Vanilla",
cost: 10
}
},
"Cake": {
2: {
flavor: "Oreo",
cost: 30
}
}
}
};
function showCategories(){
let userPicked = document.getElementById("list").value;
var div = document.getElementById("div");
if(userPicked == 'dessert'){
var categories = "Inventory";
categories += "<br>";
var options = Object.keys(dessert.inventory);
categories += options;
div.innerHTML = categories;
}
}
还有我的 html 文件:
<html>
<head>
<title>Welcome</title>
</head>
<body>
<div><h1>Welcome</h1></div><br />
<div class="dropdown">
<form>
<select name="list" id="list" accesskey="target">
<option value="none">Pick store</option>
<option value="one">Desserts</option>
</select>
<input type=button value="Select" onclick="showOptions()" onclick = "showCategories()"/>
</form>
</div>
</div>
<div id="div"></div>
<script src="store.js"></script>
</body>
</html>
最佳答案
Object.keys返回一个数组。您可以迭代数组来构建新字符串，或者简单地加入它:
categories += options.join('<br>')
编辑:您的代码中存在一些错误，导致此功能无法正常工作:
- 您的按钮上只有一个 onclick 属性:
onclick="showCategories()" - Desserts 的选项值需要与 showCategories 中的 if 语句相匹配。因此，要么将 if 条件更改为
userPicked === 'one'，或将“甜点”选项值更改为<option value="dessert">Desserts</option>
关于Javascript - 将对象键打印到 HTML，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59996442/