如何使用循环将多维数组填充到html表中

时间:2019-02-12 19:47:43

标签: javascript arrays loops html-table

我正在分配一个任务,其中我将创建一个由5个我最喜欢的电影组成的数组。我能够遍历数组以将名称打印到html表中,但是我的作业的第二部分是关于从原始数组创建多维数组,该数组具有关于1的四个子数组。 2.主角人物名称3.主角家乡4.主角年龄。然后,我想遍历多维数组以将所有数组中的数据打印到4列表中。

我很新,并且已经为此工作了几个小时。香港专业教育学院试图将html表与我的表分开,并将其链接回去,而我也尝试在

内编写html表
<script type="text/javascript">

  var myMovies = [
['Mr.Nobody', ' Jared Leto', ' Bossier City, LA', ' 47'],
['Jumanji', ' Robin Williams', ' Chicago, IL', ' 63'],
['Hunger Games', ' Jennifer Lawrence', ' Indian Hills, KY', ' 28'],
['Good Will Hunting', ' Matt Damon', ' Cambridge, MA', ' 48'],
['Sucide Squad', ' Margot Robbie', ' Dalby, Australia', ' 28']
        ];


myMovies.unshift(['Crazy Rich Asians', ' Constance Wu', ' Richmond, 
VA', ' 36']);

myMovies.pop();

    document.write('<table>');
    document.write('<tr><th>Movies</th><th>Actors</th><th>Home Towns</th><th>Age</th></tr>');

    for(var i=0, len=myMovies.length; i<len; i++){
        for(var j=0, len2=myMovies[i].length; j<len2; j++){
            document.write('<tr><td' + );
        }
    }

</script>

我这样做时能够获得正确的结果

var myMovies = ['Mr.nobody', ' Jumanji', ' Hunger Games', ' Good 
    Will Hunting', ' Suicide Squad'];

document.write('<table>');
document.write('<tr><th>My Movies!</th></tr>');

for var( i=0; i<myMovies.lenght; i++){
    document.write('<tr><td>' + myMovies[i] + '</td></tr>');
}
document.write('</table>');

1 个答案:

答案 0 :(得分:0)

您的for循环是错误的。我已经将其修复并放在此代码段中。

var myMovies = [
	['Mr.Nobody', ' Jared Leto', ' Bossier City, LA', ' 47'],
	['Jumanji', ' Robin Williams', ' Chicago, IL', ' 63'],
	['Hunger Games', ' Jennifer Lawrence', ' Indian Hills, KY', ' 28'],
	['Good Will Hunting', ' Matt Damon', ' Cambridge, MA', ' 48'],
	['Sucide Squad', ' Margot Robbie', ' Dalby, Australia', ' 28']
];

document.write('<table>');
document.write('<tr><th>Movies</th><th>Actors</th><th>Home Towns</th><th>Age</th></tr>');

for(var i = 0; i < myMovies.length; i++){
	document.write(`<tr>`);
	for(var j = 0; j < myMovies[i].length; j++){
		document.write(`<td>${myMovies[i][j]}</td>`);
	}
	document.write(`</tr>`);
}
document.write(`</table>`);