JSON基础入门实战讲解在线视频课程-嵌套 JSON 对象中的数组

绝地灬酷狼 2024-02-19 16:35 5阅读 0赞

JSON 对象中数组可以包含另外一个数组，或者另外一个 JSON 对象：  
微信小程序交流群：111733917 | 微信小程序从0基础到就业的课程：[https://edu.csdn.net/topic/huangjuhua][https_edu.csdn.net_topic_huangjuhua]  
实例

myObj = { 
    "name":"网站",
    "num":3, 
    "sites": [
    { "name":"Google", "info":[ "Android", "Google 搜索", "Google 翻译" ] }, 
    { "name":"Runoob", "info":[ "菜鸟教程", "菜鸟工具", "菜鸟微信" ] }, 
    { "name":"Taobao", "info":[ "淘宝", "网购" ] } 
    ] 
    }

我们可以使用 for-in 来循环访问每个数组：  
实例

for (i in myObj.sites) { 
    x += "<h1>" + myObj.sites[i].name + "</h1>"; 
    for (j in myObj.sites[i].info) { 
    x += myObj.sites[i].info[j] + "<br>"; 
    } 
    }

完整实例

<!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>JS中文教程网 8939.org</title>
    </head>
    <body>
    
    <p>循环内嵌数组</p>
    <p id="demo"></p>
    	
    <script>
    var myObj, i, j, x = "";
    myObj = {
        "name":"网站",
        "num":3,
        "sites": [
            { "name":"Google", "info":[ "Android", "Google 搜索", "Google 翻译" ] },
            { "name":"Runoob", "info":[ "菜鸟教程", "菜鸟工具", "菜鸟微信" ] },
            { "name":"Taobao", "info":[ "淘宝", "网购" ] }
        ]
    }
    for (i in myObj.sites) {
        x += "<h1>" + myObj.sites[i].name + "</h1>";
        for (j in myObj.sites[i].info) {
            x += myObj.sites[i].info[j] + "<br>";
        }
    }
    document.getElementById("demo").innerHTML = x;
    </script>
    
    </body>
    </html>

效果如图  
![在这里插入图片描述][20190124140937618.png]

[欢迎大家学习我的视频课程：JSON基础入门实战讲解在线视频课程][JSON]

![JSON基础入门实战讲解在线视频课程-嵌套 JSON 对象中的数组][JSON_-_ JSON]

[https_edu.csdn.net_topic_huangjuhua]: https://edu.csdn.net/topic/huangjuhua
[20190124140937618.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/29057a047d214b938a2dbeebec817e2d.png
[JSON]: https://ke.qq.com/course/351621?tuin=2b10d56
[JSON_-_ JSON]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/820a5fe3c68b4332a8786966784bcc48.png