如何遍历数组/对象并将某些元素添加到 li？

Question

这是我的第一个问题，如果有点含糊，请道歉。 我正在学习 JS，我已经被一个问题困住了几个小时。 我得到了一个 object，并被告知将 object 中的某些对象添加到 ul。

{
"dsl": {  
"DSL-I-100000": {
    "DSL-I-100000": {      // Add this to an li  
        "priority": "1",  
            "standard": true,  
            "customer": true,  
            "internet": true,  
            "business": true,  
            "consumer": true,  
            "filename": "DSL-I-100000.json",  
            "download": "100",  
            "vpCategory": "dsli"  
    }
},  
"DSL-IP-100000": {  
    "DSL-IP-100000": {    // Add this to an li  
        "priority": "1",  
            "standard": true,
            "customer": true,
            "internet": true,
            "phone": true,
            "business": true,
            "consumer": true,
            "filename": "DSL-IP-100000.json",
            "download": "100",
            "vpCategory": "dslip"
    }
},  
"DSL-IP-16000": {    
    "DSL-IP-16000": {     // Add this to an li  
        "priority": "1",  
            "standard": true,
            "customer": true,
            "internet": true,
            "phone": true,
            "business": true,
            "consumer": true,
            "filename": "DSL-IP-16000.json",
            "download": "16",
            "vpCategory": "dslip"
    }
},

我的任务是创建一个包含我的导师所说的“元代码”的列表。 那将是'“DSL-I-100000”：'，“DSL-IP-100000”：，“DSL-IP-16000”：。 go 关于这个的最佳方法是什么？ 我的 JS 知识非常有限，所以请像对傻子一样解释。 先感谢您。

Answer 1

只需从obj.dsl获取密钥，并为每个密钥创建一个li元素。

 const obj = { dsl: { "DSL-I-100000": { "DSL-I-100000": { priority: "1", standard: true, customer: true, internet: true, business: true, consumer: true, filename: "DSL-I-100000.json", download: "100", vpCategory: "dsli", }, }, "DSL-IP-100000": { "DSL-IP-100000": { priority: "1", standard: true, customer: true, internet: true, phone: true, business: true, consumer: true, filename: "DSL-IP-100000.json", download: "100", vpCategory: "dslip", }, }, "DSL-IP-16000": { "DSL-IP-16000": { priority: "1", standard: true, customer: true, internet: true, phone: true, business: true, consumer: true, filename: "DSL-IP-16000.json", download: "16", vpCategory: "dslip", }, }, }, }; const ul = document.querySelector("ul"); Object.keys(obj.dsl).forEach(k => { const li = document.createElement("li"); li.innerText = k; ul.appendChild(li); })

 <ul> </ul>