JavaScript实现梯形乘法表的方法


Posted in Javascript onApril 25, 2015

本文实例讲述了JavaScript实现梯形乘法表的方法。分享给大家供大家参考。具体如下:

效果如下图所示:

JavaScript实现梯形乘法表的方法

表格用html中的table,tr,td,然后利用for语句实现,循环输出行和列,再根据行列的数量进行乘法运算,第一个for循环输出9行,然后内嵌一个for,在条件表达式中取第一个for循环的值然后进行输出表格运算,为什么要取第一个for循环,因为第一个for循环的次数是梯形排列的规则,梯形排列的规则是第一行一个格子,第二行二个格子,第三行三个格子,以此类推。

完整代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
var str= "<table border=1 width=500 align=center>";
for(var a=1;a<=9;a++)
{  
  str +="<tr>";
  for(b=1;b<=a;b++)
  {
  str +="<td>"+a+"×"+b+"="+a*b+"</td>";
  }
  str +="</tr>";
}
str +="</table>"
document.write(str);
</script>
</head>
<body>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
仿新浪微博返回顶部的jquery实现代码
Oct 01 Javascript
jquery移除button的inline onclick事件(已测试及兼容浏览器)
Jan 25 Javascript
javascript特殊用法示例介绍
Nov 29 Javascript
js限制checkbox选中个数以限制六个为例
Jul 15 Javascript
JS+CSS实现仿触屏手机拨号盘界面及功能模拟完整实例
May 16 Javascript
Node.js 数据加密传输浅析
Nov 16 Javascript
AngularJS使用ng-app自动加载bootstrap框架问题分析
Jan 04 Javascript
JS ES6多行字符串与连接字符串的表示方法
Apr 26 Javascript
Vue中计算属性computed的示例解读
Jul 26 Javascript
原生JS封装animate运动框架的实例
Oct 12 Javascript
如何使node也支持从url加载一个module详解
Jun 05 Javascript
bootstrap+spring boot实现面包屑导航功能(前端代码)
Oct 09 Javascript
js插件设置innerHTML时在IE8下提示“未知运行时错误”解决方法
Apr 25 #Javascript
JavaScript获取DOM元素的11种方法总结
Apr 25 #Javascript
在线所见即所得HTML编辑器的实现原理浅析
Apr 25 #Javascript
JavaScript在Android的WebView中parseInt函数转换不正确问题解决方法
Apr 25 #Javascript
Node.js和MongoDB实现简单日志分析系统
Apr 25 #Javascript
node.js操作mongodb学习小结
Apr 25 #Javascript
JavaScript按值删除数组元素的方法
Apr 24 #Javascript
You might like
摩卡咖啡
2021/03/03 咖啡文化
php计算数组相同值出现次数的代码(array_count_values)
2015/01/20 PHP
PHP实现的蚂蚁爬杆路径算法代码
2015/12/03 PHP
PHP实现限制IP访问及提交次数的方法详解
2017/07/17 PHP
深入理解javascript动态插入技术
2013/11/12 Javascript
页面元素绑定jquery toggle后元素隐藏的解决方法
2014/03/27 Javascript
jQuery基础语法实例入门
2014/12/23 Javascript
Windows系统下使用Sublime搭建nodejs环境
2015/04/13 NodeJs
js实现接收表单的值并将值拼在表单action后面的方法
2015/11/23 Javascript
JS Array.slice 截取数组的实现方法
2016/01/02 Javascript
在vue-cli脚手架中配置一个vue-router前端路由
2017/07/03 Javascript
p5.js入门教程之鼠标交互的示例
2018/03/16 Javascript
Electron 如何调用本地模块的方法
2019/02/01 Javascript
详解基于iview-ui的导航栏路径(面包屑)配置
2019/02/22 Javascript
JavaScript中构造函数与原型链之间的关系详解
2019/02/25 Javascript
微信小程序批量监听输入框对按钮样式进行控制的实现代码
2019/10/12 Javascript
es5 类与es6中class的区别小结
2020/11/09 Javascript
微信小程序轮播图swiper代码详解
2020/12/01 Javascript
简单介绍Python中的round()方法
2015/05/15 Python
Numpy array数据的增、删、改、查实例
2018/06/04 Python
Python将8位的图片转为24位的图片实现方法
2018/10/24 Python
PyQt5实现五子棋游戏(人机对弈)
2020/03/24 Python
使用python接受tgam的脑波数据实例
2020/04/09 Python
Pytorch 高效使用GPU的操作
2020/06/27 Python
python实现自动清理重复文件
2020/08/24 Python
python实现视频压缩功能
2020/12/18 Python
HTML5 拖拽批量上传文件的示例代码
2018/03/28 HTML / CSS
科尔士百货公司官网:Kohl’s
2016/07/11 全球购物
伦敦所有西区剧院演出官方票务代理:Theatre Tickets Direct
2017/05/26 全球购物
Bose英国官方网站:美国知名音响品牌
2020/01/26 全球购物
一份软件工程师的面试试题
2016/02/01 面试题
农民工工资发放承诺书
2014/03/31 职场文书
女生节标语
2014/06/26 职场文书
物业客服专员岗位职责
2015/04/07 职场文书
2015年乡镇纪委工作总结
2015/05/26 职场文书
Vue中插槽slot的使用方法与应用场景详析
2021/06/08 Vue.js