今天我自己用js实现了一个页面乘法口诀表（如图）来共享给大家，做的不是很好，如果大家有新的想法可以跟我交流哦。

代码如下：

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
for(var r=0;r<=9;r++){
for(var i=1,str="";i<=r;i++){
str+=i+"x"+r+"="+i*r+" ";
}
console.log(str);
}
var tab = document.createElement('TABLE');
tab.style.border = '1px solid black';
tab.style.borderCollapse='collapse';
for(var i = 1; i <=9 ; i++){
var tr = document.createElement('TR');
tab.appendChild(tr);
for(var j = 1,str=""; j<=i ; j++){
str=j+"x"+i+"="+i*j+" ";
var td = document.createElement('TD');
td.style.border = '1px solid black';
td.style.height = '20px';
td.innerHTML=str;
tr.appendChild(td);
}
}
document.body.appendChild(tab);

</script>
</body>
</html>

用原生js实现一个页面乘法口诀表的更多相关文章

  1. 用原生js写一个"多动症"的简历

    用原生js写一个"多动症"的简历 预览地址源码地址 最近在知乎上看到@方应杭用vue写了一个会动的简历,觉得挺好玩的,研究一下其实现思路,决定试试用原生js来实现. 会动的简历实现 ...

  2. 原生js实现一个DIV的碰撞反弹运动，并且添加重力效果

    继上一篇... 原生js实现一个DIV的碰撞反弹运动,并且添加重力效果 关键在于边界检测,以及乘以的系数问题,实现代码并不难,如下: <!DOCTYPE html> <html la ...

  3. 原生js实现一个DIV的碰撞反弹运动

     原生js实现一个DIV的碰撞反弹运动: 关键在于DIV的边界检测,进而改变运动方向,即可实现碰撞反弹效果. <!DOCTYPE html> <html lang="en& ...

  4. js用for循环实现乘法口诀表

    for循环可以打印一个乘法口诀表.需要使用for循环的嵌套 <script> for(var i = 0; i <= 9; i++){ // 外层循环控制行数,外层循环执行一次,内层 ...

  5. JS一些小算术、1加到50、乘法口诀表、买鸡等

    //从1加到50 for (var a=1,i=0;a<51; a++) {i=a+i} document.write(i);//1加到50 var num=0; for(var i=1;i&l ...

  6. 简单的用js打印乘法口诀表

    <script type="text/javascript"> //乘法口诀表 for (var i = 1; i < 10; i++) { for (var j ...

  7. javascript小程序——用嵌套循环来输出乘法口诀表

    在学习javascript过程中,一开始接触循环语句时一般拿乘法口诀表来练手,这里我将自己的练习贴在这里,希望能给和我一样的初学者些许帮助,也希望大神们能够不吝指教. 首先,来看一下乘法口诀表是什么样 ...

  8. python的乘法口诀表

    python的乘法口诀表 python的乘法口诀表 用python来写一个脚本,使得这个脚本在运行后自动输出乘法口诀表. pyton的脚本如下: #!/usr/bin/env python #codi ...

  9. 用列表+for循环生成乘法口诀表

    1 # 结合一下列表生成, 准备设计乘法表 2 # numlist = [1,2,3,4,5] 3 # [pow(i,3) for i in numlist] 4 # ## [1, 8, 27, 64 ...

随机推荐

  1. HDU-2500 做一个正气的杭电人

    http://acm.hdu.edu.cn/showproblem.php?pid=2500 做一个正气的杭电人 Time Limit: 1000/1000 MS (Java/Others)    M ...

  2. __str__

    __str__是被print函数调用的,一般都是return一个什么东西.这个东西应该是以字符串的形式表现的.如果不是要用str()函数转换.当你打印一个类的时候,那么print首先调用的就是类里面的 ...

  3. ldr指令总结

    LDR/STR字和无符号字节加载/存储 1,LDR Rd,[Rn]   2, LDR Rd,[Rn,Flexoffset] 3, LDR Rd,[Rn],Flexoffset 4, LDR Rd,la ...

  4. hdoj 5443 The Water Problem【线段树求区间最大值】

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5443 刷道水题助助兴 #include<stdio.h> #include<stri ...

  5. 校友信息管理&SNS互动平台之技术框架选择

    前言.提纲及说明: 请移步:<校友信息管理&SNS互动平台之前言.目录及说明>(博客园地址:http://www.cnblogs.com/s6cn/p/3516876.html) ...

  6. KMP算法（模板）

    话说kmp真的挺难理解的,花了挺大功夫的,恩,找了段好理解的代码,做模板了 int KMP(char *s,char *p){ int ans = -1; nex[0] = 0; int lenp = ...

  7. Theano FCN实现与训练经验与教训小结

    NaN 计算softmax loss时要用numeric robust 的计算方式. softmax与 loss可能要分开计算. 得到前者的计算方式可以是常规方法. 但计算后者时要注意无穷大和NaN的 ...

  8. JavaScript读取txt文本文件方法详解

    http://blog.163.com/sophie8910@126/blog/static/8304612620122834121264/ 第一步:创建一个可以将文件翻译成文件流的对象. Var f ...

  9. js读取本地磁盘文本文件并保存为JSON数据(有格式的文本)

    主要的代码是红色区域,HTML5获取本地文件对象并进行操作 //给上传按钮添加点击事件 $(".myappTXTUploadBtn").click(function(){ var ...

  10. android intent 隐式意图和显示意图(activity跳转)

    android中的意图有显示意图和隐式意图两种, 显示意图要求必须知道被激活组件的包和class 隐式意图只需要知道跳转activity的动作和数据,就可以激活对应的组件 A 主activity  B ...