js的内循环始终无法进入

js运行的时候,想用内循环为tr标签增加td标签,但内循环始终无法执行

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>动态数据表格</title>
    <style>
        table{
            width: 300px;
            margin: 100px auto;
        }
        th{
            background-color:rgb(145, 141, 141);
            font-size: 20px;
        }
    </style>
</head>
<body>
    <table border="1" cellspacing='0'>
        <thead>
            <tr>
                <th>姓名</th>
                <th>科目</th>
                <th>分数</th>
            </tr>
        </thead>
        <tbody>

        </tbody>
    </table>
    <script>
        var datas=[
            {
                name:'小米',
                subject:'javascript',
                grade:'100'
            },{
                name:'小红',
                subject:'python',
                grade:'49'
            },{
                name:'小明',
                subject:'java',
                grade:'86'
            }
        ]
        var tbody=document.getElementsByTagName('tbody')[0]
        for(i=0;i<datas.length;i++){
            var tr = document.createElement('tr')
            tbody.appendChild(tr)
            for(k=0;k<datas[i].length;k++){
                console.log(i)
                var td = document.createElement('td')
                tr.appendChild(td)
            }
        }
    </script>
</body>
</html> 

for(let k in datas[i]){
    console.log(k+' '+datas[i][k])
    var td = document.createElement('td')
    tr.appendChild(td)
}

里面是Object,循环Object 用 for/in,另外要用innerHTML渲染内容

for(var i=0; i < datas.length; i++){
  var tr = document.createElement('tr')
  tbody.appendChild(tr)
  for(var k in datas[i]){
    var td = document.createElement('td')
    td.innerHTML = datas[i][k]
    tr.appendChild(td)
  }
}

img

小兄弟你看看你内外的循环条件,外循环是i < datas.length,内循环写成了k < datas[i].length,多加了个下标哦