账号密码登录
忘记密码注册账号
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
获取验证码
找回密码返回
邮箱找回 手机找回
获取验证码
注册账号返回
获取验证码
其他登录方式
登录即同意《用户使用协议》和《用户隐私条款》
问答主页 -> 电脑网络
分享
  • 收藏
    X
    js加载嵌套json呈现列表?
    181
    0
    data.json 文件{ "name": "node-root", "cns": [ { "name": "node 1", "cns": null }, { "name": "node 2", "cns": [ { "name": "node 2-1", "cns": null }, { "name": "node 2-2", "cns": [ { "name": "node 2-2-1", "cns": null }, { "name": "node 2-2-2", "cns": null }, { "name": "node 2-2-3", "cns": null } ] }, { "name": "node 2-3", "cns": null } ] }, { "name": "node 3", "cns": null } ]}这是我原先的代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript" src="http://localhost:8000/library/jquery/3.6.0/jquery.min.js"></script> <script type="text/javascript"> function treeNodeWrite(el, array) { $.each(array, function(key, val) { console.log(val.name) if (val.cns !== null) { // 有子集 el.append(`<li>${val.name}</li>`) el.find(`li:contains(${val.name})`).append("<ul></ul>") el = el.find("ul").eq(0) treeNodeWrite(el, val.cns) } else { el.append(`<li>${val.name}</li>`) // 无子集 if(array[array.length - 1] === val){ el=el.parents("ul").eq(0) treeNodeWrite(el, val.cns) } } return }) } $(function() { $.getJSON("data.json", function(data) { treeNodeWrite($("ul"), data.cns); }) }) </script> </head> <body> <ul></ul> </body></html>当前的运行效果希望呈现的效果请问js代码应该怎么改求大佬指点?
    0
    打赏
    收藏
    点击回答
        全部回答
    • 共 0 条
    • 广目天王留博叉 普通会员 1楼

      在JavaScript中，你可以使用JSON.parse()函数来解析JSON字符串，然后使用JSON.stringify()函数将解析后的对象转换为JSON字符串。然后，你可以使用document.createElement()方法创建一个新的<ul>元素，将<li>元素添加到这个<ul>元素中，最后使用innerHTML属性设置这个<ul>元素的内容。

      以下是一个例子：

      ```javascript // 假设你有一个嵌套的JSON字符串 var json = '{"name":"John","age":30,"city":"New York"}';

      // 使用JSON.parse()函数解析JSON字符串 var data = JSON.parse(json);

      // 创建一个新的ul元素 var ul = document.createElement("ul");

      // 使用for循环遍历data对象 for (var key in data) { // 创建一个新的li元素 var li = document.createElement("li");

      // 使用JSON.stringify()函数将data对象转换为JSON字符串 var jsonString = JSON.stringify(data[key]);

      // 将jsonString添加到li元素中 li.innerHTML = jsonString; // 将li元素添加到ul元素中 ul.appendChild(li); }

      // 设置ul元素的内容 document.getElementById("content").innerHTML = ul.innerHTML; ```

      在这个例子中，<ul>元素将包含<li>元素，每个<li>元素都包含了JSON对象中的一个键值对。

    0 打赏 回复
    更多回答
    网站公告
    扫一扫访问手机版

    回答动态

    • 回到顶部
    • 回到顶部