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 相关文章推荐
让您的菜单不离网站
Oct 03 Javascript
Javascript 面向对象编程(一) 封装
Aug 28 Javascript
js自定义方法通过隐藏iframe实现文件下载
Feb 21 Javascript
js 实现 input type=&quot;file&quot; 文件上传示例代码
Aug 07 Javascript
javascript中字符串的定义示例代码
Dec 19 Javascript
AngularJs根据访问的页面动态加载Controller的解决方案
Feb 04 Javascript
跟我学习javascript的prototype使用注意事项
Nov 17 Javascript
JavaScript如何动态创建table表格
Aug 02 Javascript
用JS实现轮播图效果(二)
Jun 26 Javascript
AngularJS入门教程二:在路由中传递参数的方法分析
May 27 Javascript
基于Vue实现页面切换左右滑动效果
Jun 29 Javascript
Vue性能优化的方法
Jul 30 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
php执行sql语句的写法
2009/03/10 PHP
使用php清除bom示例
2014/03/03 PHP
PHP表单提交后引号前自动加反斜杠的原因及三种办法关闭php魔术引号
2015/09/30 PHP
兼容Mozilla必须知道的知识。
2007/01/09 Javascript
在IE上直接编辑网页内容的js代码(IE地址栏js)
2009/04/27 Javascript
JavaScript基础篇之变量作用域、传值、传址的简单介绍与实例
2013/06/29 Javascript
js定时器(执行一次、重复执行)
2014/03/07 Javascript
jquery实现select选中行、列合计示例
2014/04/25 Javascript
JQuery中使用on方法绑定hover事件实例
2014/12/09 Javascript
AngularJS之依赖注入模拟实现
2016/08/19 Javascript
基于JS实现类似支付宝支付密码输入框
2016/09/02 Javascript
详解AngularJS通过ocLazyLoad实现动态(懒)加载模块和依赖
2017/03/01 Javascript
AngularJS 限定$scope的范围实例详解
2017/06/23 Javascript
JavaScript选取(picking)和反选(rejecting)对象的属性方法
2017/08/16 Javascript
webpack4.0 入门实践教程
2018/10/08 Javascript
JS实现点击li标签弹出对应的索引功能【案例】
2019/02/18 Javascript
jquery html添加元素/删除元素操作实例详解
2020/05/20 jQuery
在Python中使用Neo4j数据库的教程
2015/04/16 Python
用python写的一个wordpress的采集程序
2016/02/27 Python
Python实现简易版的Web服务器(推荐)
2018/01/29 Python
Python字典创建 遍历 添加等实用基础操作技巧
2018/09/13 Python
python多线程下信号处理程序示例
2019/05/31 Python
Python实现微信机器人的方法
2019/09/06 Python
python 读取数据库并绘图的实例
2019/12/03 Python
真正了解CSS3背景下的@font face规则
2017/05/04 HTML / CSS
css3 线性渐变和径向渐变示例附图
2014/04/08 HTML / CSS
Pretty Green美国:英式摇滚服饰风格代表品牌之一
2019/01/23 全球购物
大学生表扬信范文
2014/01/09 职场文书
运动会开幕式邀请函
2014/02/03 职场文书
公司建议书怎么写
2014/05/15 职场文书
2015年妇产科工作总结
2015/05/18 职场文书
小学英语听课心得体会
2016/01/14 职场文书
python 机器学习的标准化、归一化、正则化、离散化和白化
2021/04/16 Python
Django路由层如何获取正确的url
2021/07/15 Python
使用CSS实现小三角边框原理解析
2021/11/07 HTML / CSS
DIY胆机必读:各国电子管评价
2022/04/06 无线电