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


Posted in Javascript onFebruary 22, 2016

九九乘法表使用很多种语言都可以实现。本文讲述JavaScript中常用的两种循环(For、While)来完成这四种对称的九九乘法表,这个例子是一个练习循环基础很好的方法,由于排版上对不整齐,因此循环了一个表格。

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

For循环代码

document.write("<table width='' border='>");
for(var i=; i<=; i++){
document.write("<tr>");
for(var j=; j<=i; j++){
document.write("<td>"+ j +"*"+ i +"="+ i*j +"</td>");
}
document.write("</tr>");
}
document.write("</table>");

While循环代码

document.write("<table width='' border='>");
var i = ;
while(i<=){
document.write("<tr>");
var j = ;
while(j<=i){
document.write("<td>"+ j +"*"+ i +"="+ i*j +"</td>");
j++;
}
document.write("</tr>");
i++;
}
document.write("</table>");

示例图

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

二、右下角为度的梯形乘法表:

For循环代码

document.write("<table width='' border='>");
for(var i=; i<=; i++){
document.write("<tr>");
for(var n=i; n<; n++){
document.write("<td> </td>");
}
for(var j=i; j>=; j--){
document.write("<td>"+ j +"*"+ i +"="+ i*j +"</td>");
}
document.write("</tr>");
}
document.write("</table>");

While循环代码

document.write("<table width='' border='>");
var i = ;
while(i<=){
document.write("<tr>");
var n = i;
while(n<){
document.write("<td> </td>");
n++;
}
var j = i;
while(j>=){
document.write("<td>"+ j +"*"+ i +"="+ i*j +"</td>");
j--;
}
document.write("</tr>");
i++;
}
document.write("</table>");

示例图

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

三、左上角为度的梯形乘法表:

For循环代码

document.write("<table width='' border='>");
for(var i=; i>=; i--){
document.write("<tr>");
for(var j=; j<=i; j++){
document.write("<td>"+ j +"*"+ i +"="+ i*j +"</td>");
}
document.write("</tr>");
}
document.write("</table>");

While循环代码

document.write("<table width='' border='>");
var i = ;
while(i>=){
document.write("<tr>");
var j = ;
while(j<=i){
document.write("<td>"+ j +"*"+ i +"="+ i*j +"</td>");
j++;
}
document.write("</tr>");
i--;
}
document.write("</table>");

示例图

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

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

For循环代码

document.write("<table width='' border='>");
for(var i=; i>=; i--){
document.write("<tr>");
for(var j=; j>=i; j--){
document.write("<td> </td>");
}
for(var j=i; j>=; j--){
document.write("<td>"+ j +"*"+ i +"="+ i*j +"</td>");
}
document.write("</tr>");
}
document.write("</table>");

While循环代码

document.write("<table width='' border='>");
var i = ;
while(i>=){
document.write("<tr>");
var j = ;
while(j>=i){
document.write("<td> </td>");
j--;
}
var j = i;
while(j>=){
document.write("<td>"+ j +"*"+ i +"="+ i*j +"</td>");
j--;
}
document.write("</tr>");
i--;
}
document.write("</table>");

示例图

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

以上内容是本文给大家分享的JavaScript中常用的两种循环(For、While)来完成这四种对称的九九乘法表,希望对大家有所帮助!

Javascript 相关文章推荐
javascript实现锁定网页、密码解锁效果(类似系统屏幕保护效果)
Aug 15 Javascript
使用jquery清空、复位整个输入域
Apr 02 Javascript
在JavaScript中模拟类(class)及类的继承关系
May 20 Javascript
angularjs实现文字上下无缝滚动特效代码
Sep 04 Javascript
Chrome不支持showModalDialog模态对话框和无法返回returnValue问题的解决方法
Oct 30 Javascript
原生js实现日期计算器功能
Feb 17 Javascript
在使用JSON格式处理数据时应该注意的问题小结
May 20 Javascript
详解利用 Vue.js 实现前后端分离的RBAC角色权限管理
Sep 15 Javascript
浅谈Angular路由复用策略
Oct 04 Javascript
Bootstrap框架建立树形菜单(Tree)的实例代码
Oct 30 Javascript
jQuery实现当拉动滚动条到底部加载数据的方法分析
Jan 24 jQuery
js闭包的9个使用场景
Dec 29 Javascript
基于Javascript实现倒计时功能
Feb 22 #Javascript
TypeOf这些知识点你了解吗
Feb 21 #Javascript
详谈javascript异步编程
Feb 21 #Javascript
浅谈javascript的call()、apply()、bind()的用法
Feb 21 #Javascript
EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)
Feb 21 #Javascript
javascript+HTML5自定义元素播放焦点图动画
Feb 21 #Javascript
JavaScript编程学习技巧汇总
Feb 21 #Javascript
You might like
wamp下修改mysql访问密码的解决方法
2013/05/07 PHP
解析php中const与define的应用区别
2013/06/18 PHP
PHP间隔一段时间执行代码的方法
2014/12/02 PHP
PHP基于文件存储实现缓存的方法
2015/07/20 PHP
PHP引用的调用方法分析
2016/04/25 PHP
window.parent与window.openner区别介绍
2012/04/12 Javascript
js判断屏幕分辨率的代码
2013/07/16 Javascript
快速查找数组中的某个元素并返回下标示例
2013/09/03 Javascript
jQuery关于导航条背景切换效果实现示例
2013/09/04 Javascript
Javascript 按位与赋值运算符 (&amp;=)使用介绍
2014/02/04 Javascript
JQuery EasyUI 加载两次url的原因分析及解决方案
2014/08/18 Javascript
基于Vue2.0的分页组件
2017/03/16 Javascript
JS jQuery使用正则表达式去空字符的简单实现代码
2017/05/20 jQuery
详解Nodejs内存治理
2018/05/13 NodeJs
vue+element-ui动态生成多级表头的方法
2018/08/28 Javascript
通过实例解析JavaScript for in及for of区别
2020/06/15 Javascript
详解ES6中class的实现原理
2020/10/03 Javascript
[02:24]DOTA2痛苦女王 英雄基础教程
2013/11/26 DOTA
python执行外部程序的常用方法小结
2015/03/21 Python
linux下python抓屏实现方法
2015/05/22 Python
Python基础教程之tcp socket编程详解及简单实例
2017/02/23 Python
Python网络编程 Python套接字编程
2017/09/13 Python
详解pandas中MultiIndex和对象实际索引不一致问题
2019/07/23 Python
python多线程案例之多任务copy文件完整实例
2019/10/29 Python
Django 博客实现简单的全文搜索的示例代码
2020/02/17 Python
Staples加拿大官方网站:办公用品一站式采购
2016/09/25 全球购物
The Beach People美国:澳洲海滨奢华品牌
2018/07/05 全球购物
澳大利亚先进的皮肤和激光诊所购物网站:Soho Skincare
2018/10/15 全球购物
泰国健康和美容服务预订网站:GoWabi
2019/06/03 全球购物
介绍一下Java的安全机制
2012/06/28 面试题
多媒体编辑专业毕业生求职信
2014/06/13 职场文书
办公室行政主管岗位职责
2015/04/09 职场文书
2015年秋学期教研工作总结
2015/10/14 职场文书
Python中OpenCV实现简单车牌字符切割
2021/06/11 Python
关于Python OS模块常用文件/目录函数详解
2021/07/01 Python
使用 Apache Superset 可视化 ClickHouse 数据的两种方法
2021/07/07 Servers