<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!-- CSS样式 -->
    <style>
        * {
            padding: 0;
            margin: 0;
        }
        table {
            width: 800px;
            height: 350px;
            margin: 100px auto;
            text-align: center;
            border-collapse: collapse;
        }
        table,
        td {
            border: 1px solid #000;
        }
    </style>
</head>
<body>
</body>
<script>
    // 原始版
    // document.write("<table>");
    // var j = 1;
    // while (j <= 9) {
    //     document.write("<tr>");
    //     var i = 1;
    //     while (i <= j) {
    //         document.write("<td>" + i + "*" + j + "=" + (i*j) + "</td>");
    //         i++;
    //     }
    //     document.write("</tr>");
    //     j++;
    // }
    // document.write("</table>");
 

　//-　-　-分割线- - - -

    // 附带奇偶数换色版
    document.write("<table>");
    for (var h = 1; h <= 9; h++) {  //循环行数
        // 奇偶数行换色
        if (h % 2 == 1) {
            document.write("<tr style='background:pink;'>");
        } else {
            document.write("<tr style='background:#6ff;'>");
        }
        for (var g = 1; g <= h; g++) {  //循环列数，且列要小于等于行数
            // 隔列变色
            if (g % 2 == 1) {
                document.write("<td style='background:pink;'>" + g + "*" + h + "=" + g * h + "</td>");
            } else {
                document.write("<td style='background:#6ff;'>" + g + "*" + h + "=" + g * h + "</td>");
            }
        }
        document.write("</tr>");
    }
    document.write("<table>");
</script>
</html>

用js写九九乘法表格，附带背景颜色的更多相关文章

  1. 用JS写九九乘法表

    本来JS部分觉得就不是很好,结果经过一个寒假,在家的日子过的太舒适,基本把学的都快忘干净了,今天老师一说九九乘法表,除了脑子里浮现出要满足的条件,其他的都不记得了,赶快整理了一下: <scrip ...

  2. 用js实现九九乘法口诀两种方式

    js实现九九乘法口诀两种方式: 第一种是用户输入一个数弹出所对应的乘法口诀: <script type="text/javascript"> function art( ...

  3. 用python写九九乘法表

    用python来写九九乘法表,九九乘法表的结构是这样子的: 第一行是1 * 1 = 1,第二行是1 * 2 = 2 | 2 * 2 = 4...以此类推.注意到没,每一行的第一个乘的数字在从1到当行变 ...

  4. JS实现九九乘法表和时间问候语

    编码 小练习,练习使用循环实现一个九九乘法表 第一步,最低要求:在Console中按行输出 n * m = t 然后,尝试在网页中,使用table来实现一个九九乘法表 <!DOCTYPE htm ...

  5. js实现九九乘法表

    <script type="text/javascript"> var sum=0; var wite; for (var i = 1; i < 10; i++) ...

  6. 用JS实现九九乘法表

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

  7. JavaScript写九九乘法表

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

  8. JS怎么控制input框的背景颜色

    $("input").css("background-color","red"); 参考:https://zhidao.baidu.com/ ...

  9. 使用PHP几种写99乘法表的方式

    首先按照规矩,还是先废话一番,对于刚学PHP的新手来讲,用php写九九乘法表无疑是非常经典的一道练习题. 但不要小看这道练习题,它对于逻辑的考验还是相当到位的. 也许有人会觉得,九九乘法表有什么难的, ...

随机推荐

  1. python3 之 函数传参

    一.可变对象与不可变对象 在 python 中,strings, tuples, 和 numbers 是不可更改的对象,而 list,dict 等则是可以修改的对象. 不可变类型:变量赋值 a=5 后 ...

  2. Aso.Net Core 的配置系统Configuration

    目录 Aso.Net Core 的配置系统Configuration 01.Json文件的弱类型方式读取 02.Json文件的强类型获取方式 Aso.Net Core 的配置系统Configurati ...

  3. 利用堆来处理Top K问题

    目录 一.什么是Top K问题 二.Top K的实际应用场景 三.Top K问题的代码实现及其效率对比 1.用堆来实现Top K 2.用快排来实现Top K 3.用堆或用快排来实现 TopK 的效率对 ...

  4. firefox常用插件总结

    当初因为ctf比赛而接触啦firefox,慢慢的在firfox上安装满啦各种插件,今天就想着总结一下,给那些刚玩firefox的朋友一些小小的帮助也是好的. 1:Firebug    Firefox强 ...

  5. jvm垃圾回收器与内存分配策略

    一.判断对象存活的算法 1.引用计数算法 (1)概念:给对象中添加一个引用计数器每当有一个地方引用它时,计数器值加1:当引用失效时,计数器就减1:任何时刻计数器为0的对象就是不可能再被使用的. (2) ...

  6. 如何重置IE浏览器

    1.退出所有程序,包括 Internet Explorer.单击“开始”.在“开始搜索”框中键入 inetcpl.cpl 命令,然后按回车键打开“Inetnet 选项”对话框. 2.单击“高级”选项卡 ...

  7. TestNG系列（二）TestNG注解

    前言 TetsNG提供了很多注解,允许测试人员灵活地组织测试用例 一.@Test @Tets是TestNG的核心注解,被注解的方法,表示为一个测试方法. description属性 @Test(des ...

  8. NoSql中的CAP原则

    C:一致性 .A:可用性.P:分区容错性 Partition tolerance(分区容错性): 大多数分布式系统都分布在多个子网络.每个子网络就叫做一个区(partition).分区容错的意思是,区 ...

  9. 转:FileSync plugin for Eclipse 安装注意事项 Eclipse文件同步插件

    习惯了使用MyEclipse,各种插件不用自己安装,觉得开发起来很方便,现在大家都用Eclipse了,还有不用Eclipse用更高级的,IT当然开发大型项目没人用UltraEdit吧,虽然是一个不错的 ...

  10. git的基本使用-1

    1.git的安装 这里只介绍在 Linux 上安装. 如果你想在 Linux 上用二进制安装程序来安装 Git,可以使用发行版包含的基础软件包管理工具来安装. 如果以 Fedora 上为例,你可以使用 ...