Javascript 包含JSON嵌套数据中递归子行的HTML表

因此，尝试创建一个基于嵌套JSON结构的HTML表。希望有父行，单击时打开子行，单击这些子行时打开更多子行，依此类推。同时，孩子们给他们的父母留下一个很好的印象也很好

这是我的JSON数据，来自questions对象：

{"aaData":[{"id":"1","template_id":"1","question":"Is government stable?","answer":"Stable","parent_question_id":"0","section_id":"2","subquestions":[{"id":"2","template_id":"1","question":"Is there funding approved?","answer":"Since March 2913","parent_question_id":"1","section_id":"2","subquestions":[{"id":"3","template_id":"1","question":"How much funding do we have?","answer":"120 Million","parent_question_id":"2","section_id":"1"},{"id":"4","template_id":"1","question":"Do we have all raw materials available?","answer":"Not all, need to find correct type of wood.","parent_question_id":"2","section_id":"1"},{"id":"5","template_id":"1","question":"What currency is the funding in?","answer":"GBP","parent_question_id":"2","section_id":"1"},{"id":"6","template_id":"1","question":"When will the currency be paid?","answer":"7 days after invoice","parent_question_id":"2","section_id":"1"}]},{"id":"7","template_id":"1","question":"What groups are going to investigate?","answer":null,"parent_question_id":"1","section_id":"2","subquestions":[{"id":"8","template_id":"1","question":"What employees have clearance to go?","answer":null,"parent_question_id":"7","section_id":"1"},{"id":"9","template_id":"1","question":"Do employees have passports?","answer":null,"parent_question_id":"7","section_id":"1","subquestions":[{"id":"10","template_id":"1","question":"Are employees able to travel?","answer":null,"parent_question_id":"9","section_id":"1"},{"id":"11","template_id":"1","question":"Can employees enter without VISA?","answer":null,"parent_question_id":"9","section_id":"1"}]}]}]},{"id":"12","template_id":"1","question":"Is market good?","answer":null,"parent_question_id":"0","section_id":"2"}]}

然后我对其进行了编码，得到了一个表，但不知道如何对行进行父/子操作。这就是我目前所拥有的

var html = "<table><thead><tr><th class='dsr_header sorting_disabled'>ID</th><th class='dsr_header sorting_disabled'>Question</th><th class='dsr_header sorting_disabled'>Answer</th></tr><tbody>";
    var parent_question_id = 0;
    var id = 0;
    var parent_question_id_old = 0;
    var id_old = 0;



        //called with every property and it's value // will process every value as individual, must record the parent question id
        function process(key,value) {


            if(key == "id") {
                id = value; // sets current id, we need this for next row to determine if they are a child or not, we will compare with values
            } 
            if(key == "parent_question_id") {
                parent_question_id = value; // sets current parent_question_id, we need this for next row to determine if they are a child or not
            }



                if(typeof(value)=="object" && typeof(key)=="string" && value != null) { // this basically keeps the tr under control
                    html += "</tr><tr>"; // close past one and add new one. Probably good to have a flag so on first time it doesn't mess up
                }

                if(key == "id") {
                    html += "<td>"+value+"</td>";
                }
                if(key == "question") {
                    html += "<td>"+value+"</td>";
                }
                if(key == "answer") {
                    html += "<td>"+value+"</td>";
                }


            parent_question_id_old = parent_question_id;
            id_old = id;


            console.log("<td>"+key+ ": " +value+"</td>");



        }

        function traverse(questions,func) {
            for (var i in questions) {
                func.apply(this,[i,questions[i]]);  
                if (questions[i] !== null && typeof(questions[i])=="object") {

                    traverse(questions[i],func);
                }
            }
        }


        traverse(questions,process);

        html += "</tbody></table>";
        $("#test").html(html);

---

除了更高层次的建议外，链接中可能存在的重复内容没有太多相关性。需要一个较低层次的答案或链接。这可能是我一直在寻找的，以不同的方式问这个问题。