效果：

表格用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. JS高程5.引用类型（1）Object类型

    引用类型 在ECMASCript中,引用类型是一种数据结构,将数据和功能组织在一起,引用类型有时候也被称为对象定义,因为它们描述的是一类对象所具有的属性和方法.(注意:尽管ECMAScript从技术上 ...

  2. 解决motools和jquery之间的冲突

    在同一个页面需要同时使用motools和jquery,对于$,发生了冲突,以下是解决的办法. <head> <script src="./Scripts/lib/jquer ...

  3. [转]ASP.NET应用程序生命周期趣谈(五) IIS7瞎说

    Ps:建议初学者在阅读本文之前,先简要了解一下之前的几篇文章,以便于熟悉本文提到的一些关于IIS6的内容,方便理解.仅供参考. PS:为什么叫瞎说呢?我觉得自己理解的并不到位,只能是作为一个传声筒,希 ...

  4. Android 5.X新特性之RecyclerView基本解析及无限复用

    说到RecyclerView,相信大家都不陌生,它是我们经典级ListView的升级版,升级后的RecyclerView展现了极大的灵活性.同时内部直接封装了ViewHolder,不用我们自己定义Vi ...

  5. (视频)Erich Gamma 与 Visual Studio Online 的一点野史

    大家对Erich Gamma的熟悉应该都集中在<设计模式>, Eclipse以及最近微软所发布的Visual Studio Code跨平台代码编辑器.其实在Erich加入微软的头几年里,他 ...

  6. 从配置读取一段时间(TimeSpan)

    C#的TimeSpan表示一段时间,DateTime表示一个时间点.TimeSpan可正可负,可与DateTime相加减,很方便,我喜欢. 代码中我们经常要表示一段时间,用一个统一的单位(时 或者 分 ...

  7. SPI基础知识

    Serial Peripheral Interface 是摩托罗拉公司提出的一种总线协议,主要应用在EEPROM,FLASH,实时时钟,A/D转换,以及数字信号处理和数字信号解码器中 是一种高速,全双 ...

  8. bug描述技巧

    进入测试行业已经两年了,我从未认真的考虑过提交一个bug需要注意哪些问题,只是主观的认为我只需要描述清楚就OK了,但是我在工作中发现有个别的开发经常跑来告诉我"这个bug你是不是描述错了&q ...

  9. [转]OAuth 2.0 - Authorization Code授权方式详解

    本文转自:http://www.cnblogs.com/highend/archive/2012/07/06/oautn2_authorization_code.html I:OAuth 2.0 开发 ...

  10. Oracle插入日期格式出现 ORA-01843: not a valid month的解决办法

    Oracle 在插入时间类型的时候如果不注意插入的格式就很容易出错,基本上只要转一下时间格式就可以解决. DateTime转成特定格式的字符串: var dateString = DateTime.N ...