效果：

表格用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+"&times;"+b+"="+a*b+"</td>";
    }
    str +="</tr>";
}
str +="</table>"
document.write(str);
</script>
</head>
<body>
</body>
</html>

练习JavaScript实现梯形乘法表的更多相关文章

  1. 练习JavaScript实现梯形乘法表 效果：

    表格用html中的table,tr,td,然后利用for语句实现,循环输出行和列,再根据行列的数量进行乘法运算,第一个for循环输出9行, 然后内嵌一个for,在条件表达式中取第一个for循环的值然后 ...

  2. javascript实现九九乘法表

    CSS代码部分: <style type="text/css"> table { width: 800px; height: 300px; border-collaps ...

  3. JavaScript制作九九乘法表

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. JavaScript写九九乘法表

    <script language=javascript> for(i=1;i<=9;i++){ for(j=1;j<=9;j++){ document.write (i+&qu ...

  5. javascript 实现九九乘法表

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. javascript实现99乘法表

    for(var i=1; i<=9; i++) { for(var j=1; j<=i;j++) { document.write(i+"x"+i+"=&qu ...

  7. 1+X证书学习日志——javascript打印九九乘法表（基础算法）

    /// 注意要给td加上宽高属性,不然就看不到啦 /// td{ width:100px; height:30px; border:1px solid red; }

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

    JS实现上下左右对称的九九乘法表 css样式 <style> table{ table-layout:fixed; border-collapse:collapse; } td{ padd ...

  9. 用JS，打印99乘法表

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

随机推荐

  1. HttpSession与Hibernate中Session的区别

    一.javax.servlet.http.HttpSession是一个抽象接口 它的产生:J2EE的Web程序在运行的时候,会给每一个新的访问者建立一个HttpSession,这个Session是用户 ...

  2. JAVA编程思想（第四版）学习笔记----4.8 switch(知识点已更新)

    switch语句和if-else语句不同,switch语句可以有多个可能的执行路径.在第四版java编程思想介绍switch语句的语法格式时写到: switch (integral-selector) ...

  3. CSS3：linear-gradient，线性渐变的使用方法

    CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的过渡. 以前,你必须使用图像来实现这些效果,现在通过使用 CSS3 的渐变(gradients)即可实现.此外,渐变效果 ...

  4. RemodelanyWhere11.0.2673版本下载

    百度云盘链接:http://pan.baidu.com/s/1geL5lez 密码:hisq 原文转载至:http://blog.sun0816.com/13623.html

  5. VS2015调试时没有启动IIS Express Web服务器 或者停止调试时 IIS Express 跟着关闭

    解决方法: 打开 解决方案资源管理器 -> 点选 Web 项目选择 -> 属性 -> Web "服务器"  去掉勾选"将服务器设置应道所有用户" ...

  6. 在双系统（Windows与Ubuntu）下删除Ubuntu启动项

    问题概述:因为在自己学习Linux的时候,按照网上的教程错误的删除了Ubuntu的一个内核驱动,导致Ubuntu不能启动.我想到的办法是重新安装系统,重装系统的第一步便是将Ubuntu从电脑中卸载.该 ...

  7. mongodb 性能篇

    一.  索引及其优化 索引的概述 数据库的索引好比是一本书前面的目录,能加快数据查询的速度. 适当的地方增加索引,不合理的地方删除次优索引,能优化性能较差的应用. 索引的操作 基础索引:db.ken. ...

  8. 使用Servlet和JSP实现一个简单的Web聊天室系统

    1 问题描述                                                利用Java EE相关技术实现一个简单的Web聊天室系统,具体要求如下. (1)编写一个登录 ...

  9. 理解 neutron（15）：Neutron linux-bridge-agent 创建 linux bridge 的简要过程

    学习 Neutron 系列文章: (1)Neutron 所实现的虚拟化网络 (2)Neutron OpenvSwitch + VLAN 虚拟网络 (3)Neutron OpenvSwitch + GR ...

  10. [转载]fullPage.js中文api 配置参数~

    fullPage.js中文api 配置参数 选项 类型 默认值 说明 verticalCentered 字符串 true 内容是否垂直居中 resize 布尔值 false 字体是否随着窗口缩放而缩放 ...