将Ul和Li提取到Jsonfile中

Question

var obj;
var datadata;
$(document).ready(function()
{
$("#btns").click(function(){
  function buildJSON($ul) {
    console.log($ul.length);
    var id=document.getElementsByClassName("table")[0].id;
       var subObj = { "Table Name": $ul.contents().eq(0).text().trim(),"type":"table","id":id};
      
       $ul.children('li').children().each(function() {
         if (!subObj.columns) { subObj.columns = [];
          }
         subObj.columns.push(buildJSONchild($(this)));
       });
    document.getElementById("getdata").style.visibility = "visible";
     return subObj;
  
   }
   
   function buildJSONchild($li) {
    console.log($li.length);
    
    console.log(document.getElementsByClassName("child").id);

       var subObj = { name : $li.contents().eq(0).text().trim(),"isprimary":"1","type":"Integer" };
       $li.children('ul').children().each(function() {
         if (!subObj.columns) { subObj.columns = [];
          }
         subObj.columns.push(buildJSONchild($(this)));
       });
    document.getElementById("getdata").style.visibility = "visible";
     return subObj;
  
   }


  obj = buildJSON($(".canvasList").children());
  datadata=JSON.stringify(obj,null,2);
  console.log(datadata);
 $('.canvasList').append('<pre>').find('pre').append(JSON.stringify(obj, null, 2));


console.log(obj);
$("#getdata").click(function(){

  console.log(obj);
    console.log(datadata);
     var data = JSON.stringify(datadata, null, 4);
    
        console.log(data);    
        var blob = new Blob( [ datadata ], {
            type: 'application/json'
        });
        url = URL.createObjectURL( blob );
        var link = document.createElement( 'a' );
        link.setAttribute( 'href', url );
        link.setAttribute( 'download', 'example.json' );
        
        var event = document.createEvent( 'MouseEvents' );
        event.initMouseEvent( 'click', true, true, window, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
        link.dispatchEvent( event );

        });

});

});

<div class="canvasList" >
    <ul class="table" id="id_1234567890">table-main
        <li class="child">
          <ul>
            <li>
              id
            </li>
          </ul>
        </li>
        <li >
            <ul>
                <li>
                  name
                </li>
              </ul>
        </li>
        <li >
            <ul>
                <li>
                  class
                </li>
              </ul>  
        </li>
        <li >
            <ul>
                <li>
                  school
                </li>
              </ul>
        </li>
        <li >
            <ul>
                <li>
                  stream
                </li>
              </ul>
        </li>
    </ul>
    <ul class="table" id="id_12345678900987654321">table-main2
        <li class="child">
          <ul>
            <li>
              student
            </li>
          </ul>
        </li>
        <li >
            <ul>
                <li>
                  teacher
                </li>
              </ul>
        </li>
        <li >
            <ul>
                <li>
                  Principle
                </li>
              </ul>  
        </li>
        <li >
            <ul>
                <li>
                  Lacture
                </li>
              </ul>
        </li>
        <li >
            <ul>
                <li>
                  watchman
                </li>
              </ul>
        </li>
    </ul>


</div>
 
<button id="btns">SHOW DATA</button>
<button id="getdata" style=" visibility: hidden;">DOWNLOAD DATA</button>

我想转换 HTML页面表或任何要保存到JSON文件中的数据，就像我们有学生的ID，学校名称，班级，母亲姓名，父亲姓名等数据一样，我想要将数据转换为JSON文件，如果可以，请给我答案或任何提示，您对这个问题的看法。我需要帮助..但如果可能，我希望在 angular7 中使用它如果有人对此问题有任何线索，请帮助我