JS实现上下左右对称的九九乘法表

css样式

<style>

	table{

		table-layout:fixed;

		border-collapse:collapse;

	}

	td{

		padding:10px;

		border:1px solid #999;

	}

	td:empty{

		border:none;

	}

</style>

一 左下角为度的梯形乘法表：

1.for循环代码

<table>

	<script>

		for(var i=1;i<=9;i++){

			document.write("<tr>");

				for(var j=1;j<=i;j++){

					document.write("<td>"+j+"&times;"+i+"="+(j*i)+"</td>")

				}

			document.write("</tr>");

		}

	</script>

</table>

2.while循环

<table>

	<script>

		var i=1;

		while(i<=9){

			document.write("<tr>");

				var j=1;

				while(j<=i){

					document.write("<td>"+j+" x "+i+"="+(j*i)+"</td>");

					j++;

				}

			document.write("</tr>");

			i++;

		}

	</script>

</table>

3.do-while循环

<table>

	<script>

		var i=1;

		do{

			document.write("<tr>");

				var j=1;

				do{

					document.write("<td>"+j+"&times;"+i+"="+(j*i)+"</td>");

					j++;

				}while(j<=i);

			document.write("</tr>");

			i++;

		}while(i<=9);

	</script>

</table>

示例图

二 左上角为度的梯形乘法表：

1.for循环代码

<table>

	<script>

		for(var i=9;i>=1;i--){

			document.write("<tr>");

				for(var j=1;j<=i;j++){

					document.write("<td>"+j+"&times;"+i+"="+(j*i)+"</td>")

				}

			document.write("</tr>");

		}

	</script>

</table>

2.while循环

<table>

	<script>

		var i=9;

		while(i>=1){

			document.write("<tr>");

				var j=1;

				while(j<=i){

					document.write("<td>"+j+" x "+i+"="+(j*i)+"</td>");

					j++;

				}

			document.write("</tr>");

			i--;

		}

	</script>

</table>

3.do-while循环

<table>

	<script>

		var i=9;

		do{

			document.write("<tr>");

				var j=1;

				do{

					document.write("<td>"+j+"&times;"+i+"="+(j*i)+"</td>");

					j++;

				}while(j<=i);

			document.write("</tr>");

			i--;

		}while(i>=1);

	</script>

</table>

示例图

三 右下角为度的梯形乘法表：

1.for循环代码

<table>

	<script>

		for(var i=1;i<=9;i++){

			document.write("<tr>");

				for(var a=1;a<=9-i;a++){

					document.write("<td></td>");

				}

				for(var j=1;j<=i;j++){

					document.write("<td>"+j+"&times;"+i+"="+(j*i)+"</td>")

				}

			document.write("</tr>");

		}

	</script>

</table>

2.while循环

<table>

	<script>

		var i=1;

		while(i<=9){

			document.write("<tr>");

				var a=1;

				while(a<=9-i){

					document.write("<td></td>");

					a++;

				}

				var j=1;

				while(j<=i){

					document.write("<td>"+j+" x "+i+"="+(j*i)+"</td>");

					j++;

				}

			document.write("</tr>");

			i++;

		}

	</script>

</table>

3.do-while循环

<table>

	<script>

		var i=1;

		do{

			document.write("<tr>");

				var a=0;

				do{

					document.write("<td></td>");

					a++;

				}while(a<=9-i);

				var j=1;

				do{

					document.write("<td>"+j+"&times;"+i+"="+(j*i)+"</td>");

					j++;

				}while(j<=i);

			document.write("</tr>");

			i++;

		}while(i<=9);

	</script>

</table>

示例图

四 右上角为度的梯形乘法表：

1.for循环代码

<table>

	<script>

		for(var i=9;i>=1;i--){

			document.write("<tr>");

				for(var a=1;a<=9-i;a++){

					document.write("<td></td>");

				}

				for(var j=1;j<=i;j++){

					document.write("<td>"+j+"&times;"+i+"="+(j*i)+"</td>")

				}

			document.write("</tr>");

		}

	</script>

</table>

2.while循环

<table>

	<script>

		var i=9;

		while(i>=1){

			document.write("<tr>");

				var a=1;

				while(a<=9-i){

					document.write("<td></td>");

					a++;

				}

				var j=1;

				while(j<=i){

					document.write("<td>"+j+" x "+i+"="+(j*i)+"</td>");

					j++;

				}

			document.write("</tr>");

			i--;

		}

	</script>

</table>

3.do-while循环

<table>

	<script>

		var i=9;

		do{

			document.write("<tr>");

				var a=0;

				do{

					document.write("<td></td>");

					a++;

				}while(a<=9-i);

				var j=1;

				do{

					document.write("<td>"+j+"&times;"+i+"="+(j*i)+"</td>");

					j++;

				}while(j<=i);

			document.write("</tr>");

			i--;

		}while(i>=1);

	</script>

</table>

示例图

JS实现上下左右对称的九九乘法表的更多相关文章

  1. 用JS的for循环打印九九乘法表

    需要使用两个for循环嵌套,代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  2. js写一个简单的九九乘法表

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 记得初学JS时候练个九九乘法表都写的要死要活

    还记得当初刚接触JS时候,看到视频中老师写了个九九乘法表,觉得好神奇,可是自己在下面动手写了半天还是有各种问题,甚是懊恼啊.今又看到园子里有关于乘法表的博文,出于对过去的不舍与缅怀,遂重写一遍. &l ...

  4. js九九乘法表的应用

    <html> <head> <meta charset=utf-8" /> <title>js九九乘法表</title> < ...

  5. 用JS写九九乘法表

    本来JS部分觉得就不是很好,结果经过一个寒假,在家的日子过的太舒适,基本把学的都快忘干净了,今天老师一说九九乘法表,除了脑子里浮现出要满足的条件,其他的都不记得了,赶快整理了一下: <scrip ...

  6. 用js实现打印九九乘法表

    用js在打印九九乘法表 思考 在学习了流程控制和条件判断后,我们可以利用js打印各式各样的九九乘法表 不管是打印什么样三角形九九乘法表,我们都应该找到有规律的地方,比如第一列的数字是什么规律,第一行的 ...

  7. 利用js的for循环实现一个简单的“九九乘法表”

    For循环九九乘法表 for循环是javascript中一种常用的循环语句,可以很好的解决在程序中需要重复执行某些语句,利用for循环实现简单的“九九乘法表”的效果: 让循环从小到大,依次排序,并计算 ...

  8. 九九乘法表，全js编写，放入table表格带入页面渲染出来

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. JS实现九九乘法表和时间问候语

    编码 小练习,练习使用循环实现一个九九乘法表 第一步,最低要求:在Console中按行输出 n * m = t 然后,尝试在网页中,使用table来实现一个九九乘法表 <!DOCTYPE htm ...

随机推荐

  1. Python目录链接

    第1章 就这么愉快的开始吧 课时1:我和python的第一次亲密接触 一.Python3的下载与安装 二.从IDIE启动Python 三.尝试点新的东西 四.为什么会这样? 五.课时01课后习题及答案 ...

  2. SPFA模板 Bellmanford优化版

    SPFA模板: queue<int>Q; ]; ],sumv[]; *],__next[*],e,w[*],first[],cnts[]; void AddEdge(int U,int V ...

  3. post 中文乱码处理 接受的编码--->解码成字节数组(无任何编码形式)----->编码成想要的格式

  4. sqoop将oracle数据导入hdfs集群

    使用sqoop将oracle数据导入hdfs集群 集群环境: hadoop1.0.0 hbase0.92.1 zookeeper3.4.3 hive0.8.1 sqoop-1.4.1-incubati ...

  5. C&C++——基本说明

    预处理器(Preprocessor) 1 . 用预处理指令#define 声明一个常数,用以表明1年中有多少秒(忽略闰年问题) #define SECONDS_PER_YEAR (60 * 60 * ...

  6. 【BZOJ 1492】 [NOI2007]货币兑换Cash 斜率优化DP

    先说一下斜率优化:这是一种经典的dp优化,是OI中利用数形结合的思想解决问题的典范,通常用于优化dp,有时候其他的一些决策优化也会用到,看待他的角度一般有两种,但均将决策看为二维坐标系上的点,并转化为 ...

  7. 【NOIP模拟赛】就 反悔贪心

    biubiu~~~ 这道题,考场上上来就dp然后发现怎么优化也不行.............最后发现是贪心............. 正解:带反悔的贪心,原理是,假设我们现在得到了取i个的最优解那么我 ...

  8. WCF分布式开发步步为赢(13):WCF服务离线操作与消息队列MSMQ

    之前曾经写过一个关于MSMQ消息队列的文章:WCF分布式开发必备知识(1):MSMQ消息队列 ,当时的目的也是用它来作为学习WCF 消息队列MSMQ编程的基础文章.在那篇文章里,我们详细介绍了MSMQ ...

  9. POJ3436：ACM Computer Factory（最大流）

    ACM Computer Factory Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 9963   Accepted: 3 ...

  10. Tumblr：150亿月浏览量背后的架构挑战

    Tumblr:150亿月浏览量背后的架构挑战 2013/04/08 · IT技术, 开发 · 9.9K 阅读 · HBase, Tumblr, 架构 英文原文:High Scalability,编译: ...