我必须在带有标题和副标题的列表中显示选项卡值。 我可以读取对象键计数,但未能获得每个节点的值和子值。
请告知如何检索值并在HTML中显示
null
var tab= {
"a": {
"one": [
{
"name": "xxx",
"age": "10"
}
],
"two": [
{
"name": "yxss",
"age": "11"
}
]
},
"b": {
"one": [
{
"name": "ctr",
"age": "11"
},
{
"name": "cft",
"age": "11"
}
]
},
"c": {
"two": [
{
"name": "cccc",
"age": "11"
}
]
}
}
let count = Object.keys(tab).length;
console.log(count);
for (i =0; i < count ; i ++)
{
console.log("<h1>"+tab[i]+"</h1>");
let count1 = Object.values(tab[i]).length;
for (j =0; j < count1 ; j++)
{
console.log(tab[i][j]);
}
}
null
对你有好处吗?
null
var tab= {
"a": {
"one": [
{
"name": "xxx",
"age": "10"
}
],
"two": [
{
"name": "yxss",
"age": "11"
}
]
},
"b": {
"one": [
{
"name": "ctr",
"age": "11"
},
{
"name": "cft",
"age": "11"
}
]
},
"c": {
"two": [
{
"name": "cccc",
"age": "11"
}
]
}
}
$(document).ready(function() {
Object.keys(tab).forEach(function(k) {
$('#result').append('<h1>' + k + '</h1>')
Object.keys(tab[k]).forEach(function(kk) {
$('#result').append('<ul id= "' + kk + '">' + kk + '</ul>')
tab[k][kk].forEach(function(i) {
$('#'+kk).append('<li>' + i.name + '</li>')
})
})
})
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="result"></div>
请执行以下操作:
null
<script>
const tabs = {
"a": {
"one": [
{
"name": "xxx",
"age": "10"
}
],
"two": [
{
"name": "yxss",
"age": "11"
}
]
},
"b": {
"one": [
{
"name": "ctr",
"age": "11"
},
{
"name": "cft",
"age": "11"
}
]
},
"c": {
"two": [
{
"name": "cccc",
"age": "11"
}
]
}
};
for (const tab in tabs) {
document.write("<h2>" + tab + "</h2>");
for (const subitem in tabs[tab]) {
document.write(`${subitem}`)
document.write('<ul>')
for (value of tabs[tab][subitem]) {
document.write(`<li>${value.name} - ${value.age}</li>`)
}
document.write('</ul>')
}
}
</script>
请尝试以下操作:
null
var tab= {"a": {"one": [{"name": "xxx","age": "10"} ],"two": [{"name": "yxss","age": "11"}]},"b": {"one": [{"name": "ctr","age": "11"},{"name": "cft","age": "11"}]},"c": {"two": [{"name": "cccc","age": "11"}]}}
tab = Object.entries(tab).map(([key, value]) => `<ul><li>${key}
<ul>${Object.entries(value).map(([k, v]) => `<li>${k}
<ul>${v.map(obj => `<li>${obj.name}</li>`).join('')}</ul>
</li>`).join('')}</ul>
</li></ul>`).join('')
document.write(tab);