前端算法

73 阅读1分钟

1.将dom转换成json对象

描述:将下面的dom结构转换成对应的json对象格式

<div class="container" id="1">
        <div class="header-container">
                <div class="header">
                        <a href="">a标签</a>
                        <a href="">a标签</a>
                        <a href="">a标签</a>
                </div>
        </div>
        <div class="content-container">
                <img src="" alt="">
                <div class="content">
                        <span>搜索</span>
                        <input type="text">
                        <span>话筒</span>
                </div>
                <div class="btns">
                        <button>按钮1</button>
                        <button>按钮2</button>
                </div>
        </div>
</div>
{"tag":"DIV",
"attributes":{"class":"container","id":"1"},
"children":[
    {"tag":"DIV",
    "attributes":{"class":"header-container"},
    "children":[{"tag":"DIV","attributes":{"class":"header"},
    "children:[{"tag":"A","attributes":{"href":""}}, {"tag":"A","attributes":{"href":""}},{"tag":"A","attributes":{"href":""}}]}]},{"tag":"DIV","attributes":{"class":"content-container"},
    "children":[{"tag":"IMG","attributes":{"src":"","alt":""}},{"tag":"DIV","attributes":{"class":"content"},
    "children":[{"tag":"SPAN","attributes":{}},{"tag":"INPUT","attributes":{"type":"text"}},{"tag":"SPAN","attributes":{}}]},{"tag":"DIV","attributes":{"class":"btns"},
    "children":[{"tag":"BUTTON","attributes":{}},{"tag":"BUTTON","attributes":{}}]}]}]}

题解:将dom转换成json对象

2.列表转换成树状结构

描述:将source转换成下面tree类型的结构

let source = [{name: '基金概况',pid: 1,id: 11,},
{name: '基金介绍',pid: 11,id: 111,},
{name: '基金经理',pid: 111,id: 1111,},
{name: '基金回报',pid: 1,id: 12,},
{name: '业绩表现',pid: 12,id: 112,}]
let tree = [
{"name":"基金概况","pid":1,"id":11,"children":[
    {"name":"基金介绍","pid":11,"id":111,"children":[{"name":"基金经理","pid":111,"id":1111}]}
    ]
},
{"name":"基金回报","pid":1,"id":12,"children":[{"name":"业绩表现","pid":12,"id":112}]}]

题解:列表转换成树状结构