JavaScript动态创建表格，并打印九九乘法表

最新推荐文章于 2023-03-20 20:11:43 发布

一粒程序米

最新推荐文章于 2023-03-20 20:11:43 发布

阅读量1.3k

点赞数 2

分类专栏：前端CSS

本文链接：https://blog.csdn.net/weixin_43449246/article/details/118708108

版权

前端CSS 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

在这里插入图片描述

首先通过getElementById的方式获取到表格dom,然后用嵌套循环分别创建表格的行和列，创建的函数是createElement，不小心打成了createComment，导致找了好久的bug，我可能眼睛瞎了吧。最后，在每创建完一列的时候，给列赋上算式的值，并在每一行创建完之后，让表格dom追加行。

代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>

	</head>
	<body>
			<table id="mytable">
			</table>
		
		<script>
			var mytable=document.getElementById('mytable');
			for(var i=1;i<=9;i++){
				var tr=document.createElement('tr');
				for(var j=1;j<=i;j++){
					var td =document.createElement('td');
					td.innerText = i + 'x' + j + '=' + (i * j);
					tr.appendChild(td);
				}
				mytable.appendChild(tr);
			}
		</script>
		
	</body>
</html>

一粒程序米

关注

2
点赞
踩
5

收藏

觉得还不错? 一键收藏
打赏
0
评论
JavaScript动态创建表格，并打印九九乘法表

首先通过getElementById的方式获取到表格dom,然后用嵌套循环分别创建表格的行和列，创建的函数是createElement，不小心打成了createComment，导致找了好久的bug，我可能眼睛瞎了吧。最后，在每创建完一列的时候，给列赋上算式的值，并在每一行创建完之后，让表格dom追加行。代码如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>&.
复制链接

扫一扫