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 相关文章推荐
js中事件的处理与浏览器对象示例介绍
Nov 29 Javascript
jQuery简易图片放大特效示例代码
Jun 09 Javascript
深入学习AngularJS中数据的双向绑定机制
Mar 04 Javascript
Node.js项目中调用JavaScript的EJS模板库的方法
Mar 11 Javascript
AngularJS控制器继承自另一控制器
May 09 Javascript
JavaScript 数组中最大最小值
Jun 05 Javascript
使用jQuery Ajax 请求webservice来实现更简练的Ajax
Aug 04 Javascript
JavaScript中闭包的详解
Apr 01 Javascript
xmlplus组件设计系列之文本框(TextBox)(3)
May 03 Javascript
微信小程序滚动Tab实现左右可滑动切换
Aug 17 Javascript
实例分析编写vue组件方法
Feb 12 Javascript
js实现查询商品案例
Jul 22 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访问MYSQL数据库封装类(附函数说明)
2010/12/04 PHP
使用PHP编写的SVN类
2013/07/18 PHP
php解析xml 的四种简单方法(附实例)
2016/07/11 PHP
详解Yii2 之 生成 URL 的方法
2017/06/16 PHP
JS上传前预览图片实例
2013/03/25 Javascript
通过JQuery实现win8一样酷炫的动态磁贴效果(示例代码)
2013/07/13 Javascript
浅谈JavaScript中指针和地址
2015/07/26 Javascript
JS与jQ读取xml文件的方法
2015/12/08 Javascript
JS实现字符串转日期并比较大小实例分析
2015/12/09 Javascript
json格式的javascript对象用法分析
2016/07/04 Javascript
js鼠标单击和双击事件冲突问题的快速解决方法
2016/07/11 Javascript
JS实现动态增加和删除li标签行的实例代码
2016/10/16 Javascript
原生JS版和jquery版实现checkbox的全选/全不选/点选/行内点选(Mr.Think)
2016/10/29 Javascript
js 实现获取name 相同的页面元素并循环遍历的方法
2017/02/14 Javascript
JS实现div模块的截图并下载功能
2017/10/17 Javascript
bootstrap中selectpicker下拉框使用方法实例
2018/03/22 Javascript
JavaScript函数的特性与应用实践深入详解
2018/12/30 Javascript
JavaScript寄生组合式继承原理与用法分析
2019/01/11 Javascript
详解vue配置后台接口方式
2019/03/29 Javascript
解决LayUI加上form.render()下拉框和单选以及复选框不出来的问题
2019/09/27 Javascript
JavaScript将数组转换为链表的方法
2020/02/16 Javascript
深入Python函数编程的一些特性
2015/04/13 Python
django配置连接数据库及原生sql语句的使用方法
2019/03/03 Python
详解python中__name__的意义以及作用
2019/08/07 Python
使用 css3 实现圆形进度条的示例
2017/07/05 HTML / CSS
英国电信商店:BT Shop
2019/12/17 全球购物
中文专业毕业生自荐信
2013/10/28 职场文书
毕业生自荐信格式
2014/03/07 职场文书
开业庆典主持词
2014/03/21 职场文书
学生社团文化节开幕式主持词
2014/03/28 职场文书
2014年打非治违工作总结
2014/11/13 职场文书
委托培训协议书
2014/11/17 职场文书
2015年师德师风承诺书
2015/01/22 职场文书
使用Pytorch训练two-head网络的操作
2021/05/28 Python
MySQL修炼之联结与集合浅析
2021/10/05 MySQL
python使用opencv对图像添加噪声(高斯/椒盐/泊松/斑点)
2022/04/06 Python