【前端html+css+js】-- 如何实现九九乘法表？

使用JavaScript实现九九乘法表

最新推荐文章于 2023-10-13 14:26:10 发布

原创最新推荐文章于 2023-10-13 14:26:10 发布 · 817 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #javascript #html5 #html #css

前端专栏收录该内容

2 篇文章

订阅专栏

该代码示例展示了如何用HTML和JavaScript动态生成一个带有蓝色边框的九九乘法表，通过嵌套循环结构进行行和列的遍历，计算并显示乘法运算结果。

实现如下：

实现代码

<html>
	<head>
		<title>九九乘法表</title>
		<style type="text/css">
		</style>
	</head>
	<body>
	

		
	<script type="text/javascript">
			document.write("<table border='1' bordercolor='blue' cellspacing='5' cellpadding='10'>");
			var ht=9;			
			//循环行 
			for (var i = 1; i <= ht; i++) {
				document.write("<tr>");
				//循环列
				for (var j = 1; j <= i; j++) {
					document.write("<td>");
					//运算
					document.write(j+"*"+i+"="+i*j);					
					document.write("</td>");
				}
				document.write("</tr>");
			}
			
			document.write("</table>");
	
		</script>		
	</body>
</html>