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

时间： 2024-11-10 09:47:11

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

javascript实现九九乘法表

CSS代码部分: 1 <style type="text/css"> 2 table { 3 width: 800px; 4 height: 300px; 5 border-collapse: collapse; 6 } 7 td{border:1px solid red;} 8 </style> JS代码部分: 1 <script tjpe="teit/javascript"> 2 document.write("&l

JavaScript制作九九乘法表

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>九九乘法表</title> <style type="text/css"> ul,li{ margin: 0; padding: 0; list-style-type: none; } span{ display: inline-block; width: 100p

[Js高手之路第一部]JavaScript上百例实战【新版】_9 javascript二重循环乘法表与n行n列的表格

0.隔行变色的表格 HTML style 属性实现 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style> 7 table { 8 /*合并单元格之间的线*/ 9 border-collapse: collapse; 10 }

上下左右对称的九九乘法表

如题所示,九九乘法表在各个技术语言几乎都能做得到,并不是特别的希罕.本文讲述JavaScript中常用的两种循环(For.While)来完成这四种对称的九九乘法表,这个例子是一个练习循环基础很好的方法,由于排版上对不整齐,因此循环了一个表格. 一.左下角为90度的梯形乘法表: For循环代码 1 document.write("<table width='600' border=0'>"); 2 for(var i=1; i<=9; i++){ 3 document.

用javascript写乘法表

JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果.通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的.JavaScript是一种脚本语言,其源代码在发往客户端运行之前不需经过编译,而是将文本格式的字符代码发送给浏览器由浏览器解释运行. 下面就是我用JS写的一个倒置的乘法表: <!DOCTYPE html> <html> <head> <meta char

JavaScript——99乘法表

1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>99乘法表</title> 5 <style type="text/css"> 6 td { 7 color: #3399ff; 8 background-color: white; 9 border: 1px solid #3399ff; 10 padding: 3px; 11 } 12 </style> 13

在网页中打印一个99乘法表--JavaScript描述

99乘法表使用for循环,在很多公司的面试中常会要求面试者手写这个算法,算是比较经典的for循环的应用 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>99乘法表</title></head> <script type="text/javascript"> docu

javascript小实例，实现99乘法表及隔行变色

人生短暂,废话不多说,直奔主题! 这个小实例的要求: 实现在页面中输出99乘法表.(要求:以每三行为一组,实现隔行变色(颜色为白,红,黄(也可自己定义)),鼠标滑过每一行,行背景颜色变为蓝色,鼠标离开又恢复原来的颜色),隔行变色的效果需要用if和switch两种判断方式都能实现: 额,分析一下实例要求:一个99乘法表,一个多方法的隔行变色,鼠标滑过变另外一个颜色,离开恢复原色.  嗯,我们一步步来吧! 99乘法表的实现,我相信很多人都知道怎么实现,无非是2个for循环得到的结果,这里我就不多做解

用JavaScript，写99乘法表；

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script> //打印99乘法表 for (var i = 1; i <= 9; i++) { for (var j = 1; j <= i; j++) { document.write(j + "×" + i + "