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. Week1 Team Homework #2 from Z.XML-Introduction of team member with photos

    <Z.XML Introduction of each team member, with photos Z=周敏轩; X=肖俊鹏&薛亚杰; M= 毛宇 & 马辰; L=  李孟 ...

  2. 软工实践 - 第二十一次作业 BETA 版冲刺前准备

    软工 · BETA 版冲刺前准备(团队) 过去存在的问题 组员之间缺乏沟通,前后端缺乏沟通协作 组员积极性不高 基础知识不够扎实 手动整合代码效率过低 我们已经做了哪些调整/改进 通过会议加强组员之间 ...

  3. DataGridView加载gif图片

    当我们想加载图片时,一般情况下都会使用picturebox控件,这个控件可以加载各种格式的图片,当然也包括gif图片.但是有时,我们也希望一些数据展示控件也可以加载图片,比如说DataGridView ...

  4. [Elasticsearch] 多字段搜索 (三) - multi_match查询和多数字段

    multi_match查询 multi_match查询提供了一个简便的方法用来对多个字段执行相同的查询. NOTE 存在几种类型的multi_match查询,其中的3种正好和在"了解你的数据 ...

  5. IE浏览器报Promise未定义的错误

    背景: 一个vue-cli构建的vue项目,一个使用angular的项目,两个项目在其他浏览器一切正常,但是ie中会报Promise未定义的错误 解决办法: vue的项目: 1.  npm insta ...

  6. 使用Kibana

    Kibana基本使用 https://www.elastic.co/guide/en/kibana/6.x/tutorial-load-dataset.html https://www.elastic ...

  7. 大步小步算法模板题, poj2417

    大步小步模板 (hash稍微有一点麻烦, poj不支持C++11略坑) #include <iostream> #include <vector> #include <c ...

  8. [CF632A]Grandma Laura and Apples

    题目大意:有$n$个顾客买苹果,每个买一半的苹果,有时会送半个苹果.最后卖光了,问卖了多少钱 题解:倒退过来,可以把半个苹果当做一份来算,这样不会有小数 卡点:无 C++ Code: #include ...

  9. BZOJ1927 [Sdoi2010]星际竞速 【费用流】

    1927: [Sdoi2010]星际竞速 Time Limit: 20 Sec  Memory Limit: 259 MB Submit: 2582  Solved: 1601 [Submit][St ...

  10. 安徽师大附中%你赛day3T1 怜香惜玉 解题报告

    怜香惜玉 题意: 已知 \(f(x)=\frac{2 \times \sum_{(i,x)=1}^x i}{φ(x)}\) 先给定数据组数\(t\)和\(k\) 每组数据给出\(n\),求\(\sum ...