简单的九九乘法表
html 代码
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <meta name="aoliann" content="Fly">
- <title>Title</title>
- <style>
- *{ margin: 0; padding: 0; font-family:Microsoft yahei,serif;}
- li{ list-style:none;}
- #box span{
- display: inline-block;
- width: 65px;
- height: 35px;
- margin: 3px;
- border: 1px solid blue;
- font-size: 14px;
- text-align: center;
- line-height: 35px;
- }
- </style>
- </head>
- <body>
- <div id="box"></div>
- <script>
- var oBox = document.getElementById("box");
- // 外层循环决定有几行
- for (var i = 1; i <10; i++) {
- // 内层循环决定一行有几个
- for (var j = 1; j <= i; j++) {
- oBox.innerHTML += "<span>"+i+"*"+j+"="+i*j+"</span>";
- }
- oBox.innerHTML += "<br>";
- }
- oBox.innerHTML += "<hr><hr>";
- for (i = 1; i <10; i++) {
- for (j = i; j <= 9; j++) {
- oBox.innerHTML += "<span>"+i+"*"+j+"="+i*j+"</span>";
- }
- oBox.innerHTML += "<br>";
- }
- oBox.innerHTML += "<hr><hr>";
- for (i = 9; i>= 1; i--) {
- for (j = 1; j <= i; j++) {
- oBox.innerHTML += "<span>"+i+"*"+j+"="+i*j+"</span>";
- }
- oBox.innerHTML += "<br>";
- }
- oBox.innerHTML += "<hr><hr>";
- for (i = 9; i>= 1; i--) {
- for (j = i; j <= 9; j++) {
- oBox.innerHTML += "<span>"+i+"*"+j+"="+i*j+"</span>";
- }
- oBox.innerHTML += "<br>";
- }
- </script>
- </body>
- </html>
来源: http://www.qdfuns.com/article/34656/9bf828fd25801e5dea586a403c9fc3ec.html