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>

示例圖

轉載于:https://www.cnblogs.com/DCL1314/p/7368511.html

總結

以上是生活随笔為你收集整理的JS实现上下左右对称的九九乘法表的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。