javascript 练习6：打印99乘法表四个方向_九九乘法表四个方向-CSDN博客

本文链接：https://blog.csdn.net/weixin_44158324/article/details/123925401

javascript 练习6：打印99乘法表四个方向

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>九九乘法表——四个方向打印</title>
    <style type="text/css">
        table{
            margin: 20px auto;
            border-collapse: collapse;
        }
        table td{
            border: 1px solid blue;
            padding: 10px;
            font-size: 20px;
        }
    </style>
</head>
<body>

</body>
<script type="text/javascript">
    //练习6：99乘法表 四个方向
    function test2_1(){
        document.write("<h1 style='color: blue'>练习6：99乘法表 四个方向</h1>");
        document.write("<h2 style='color: blue;text-align:center'>99乘法表——左下方向</h2>");
        document.write("<table>");
        for (var i = 1; i<=9;i++){
            document.write("<tr>");
            for (var j = 1;j<=9;j++){
                document.write("<td>");
                if (i>=j){
                    document.write(j + "*" + i + "=" + (i*j));
                }
                document.write("</td>");
            }
            document.write("</tr>");
        }
        document.write("</table>");
    }
    test2_1();

    function test2_2(){
        document.write("<h2 style='color: blue;text-align:center'>99乘法表——右下方向</h2>");
        document.write("<table>");
        for (var i = 9; i>=1;i--){
            document.write("<tr>");
            for (var j = 1;j<= 9;j++){
                document.write("<td>");
                if (j>=i){
                    document.write( + i + "*" + j + "=" + (i*j));
                }
                document.write("</td>");
            }
            document.write("</tr>");
        }
        document.write("</table>");
    }
    test2_2();

    function test2_3(){
        document.write("<h2 style='color: blue;text-align:center'>99乘法表——右上方向</h2>");
        document.write("<table>");
        for (var i = 1; i<=9;i++){
            document.write("<tr>");
            for (var j = 1;j<= 9;j++){
                if (i<=j){
                    document.write("<td>" + i + "*" + j + "=" + (i*j) + "</td>");
                }else{
                    document.write("<td> </td>");
                }
            }
            document.write("</tr>");
        }
        document.write("</table>");
    }
    test2_3();

    function test2_4(){
        document.write("<h2 style='color: blue;text-align:center'>99乘法表——左上方向</h2>");
        document.write("<table>");
        for (var i = 1; i<=9;i++){
            document.write("<tr>");
            for (var j = 9;j>= 1;j--){
                if (i<=j){
                    document.write("<td>" + i + "*" + j + "=" + (i*j) + "</td>");
                }else{
                    document.write("<td> </td>");
                }
            }
            document.write("</tr>");
        }
        document.write("</table>");
    }
    test2_4();
</script>
</html>