如何在作为列表推送的 HTML 页面上构建表格？

如何解决如何在作为列表推送的 HTML 页面上构建表格？

我正在尝试将页面上的 .csv 内容显示为表格。该列表包括取决于用户的未知行和列。它不是像 2x2 或 3x4 这样的固定类型。 但我得到了如下内容；

       [
    [
    &
    #
    x
    2
    7
    ;
    x
    x
.......

我正在重定向列表并尝试了 json。列表的内容不是固定的。长度和柱边是可靠的。我正在尝试正确传递数据并显示为表格 返回列表；

return render(request,'yuklenen.html',{'veriler': yuklenen,'file': listx })

我想将其显示为 <div id="contain"></div>

代码如下：

 <script>
        var str = '<ul>';
        var data1 = "{{file}}" ;
    
        for(var x in at){
            str+='<li>' + at[x] + '<li>';
        }
    
 
    str += '</ul>';
    document.getElementById("contain").innerHTML = str;
    
 
  </script>

解决方法

希望这能让你开始：

channel = client.get_channel(849549009038344262)

function rand(min,max)
{
  return Math.round(Math.random() * (max - min) + min);
}
function update()
{
  const at = [];
  for(let x = 0; x < rand(3,10); x++)
  {
    const c = [];
    for(let y = 0; y < rand(1,10); y++)
    {
      c[y] = rand(0,100);
    }
    at[x] = c;
  }

  var str = '<ul>';

  for(var x in at){
      str+='<li>';
      for(var y in at[x])
        str += "<span>" + at[x][y] + "</span>";

      str+='</li>';
  }

  str += '</ul>';
  document.getElementById("contain").innerHTML = str;
}
update();

ul
{
  display: table;
  border-collapse: collapse;
}
li
{
  display: table-row;
}

li > span
{
  border: 1px solid black;
  vertical-align: middle;
  text-align: center;
  display: table-cell;
  width: 2em;
  height: 2em;
}