99乘法表

发布时间:2021-01-12 发布网站:前端之家 F2er.com
前端之家收集整理的这篇文章主要介绍了99乘法表前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

JavaScript写出99乘法表

<!DOCTYPE html>
<html lang="ch-zn">
<head>
    <meta charset="UTF-8">
    <title>moban</title>

    <style>
    html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu{margin:0;padding:0;}
    header,footer,section,article,aside,nav,hgroup,address,figcaption,menu,details{display:block;}
    table{border-collapse:collapse;border-spacing:0;}
    caption,th{text-align:left;font-weight:normal;}
    html,img,iframe,abbr{border:0;}
    i,cite,em,var,dfn{font-style:normal;}
    [hidefocus],summary{outline:0;}
    li{list-style:none;}
    h1,small{font-size:100%;}
    sup,sub{font-size:83%;}

    #wrap{
      font-size: 0;
    }
    #wrap span{
      display: inline-block;

      width: 70px;
      height: 35px;
      border: 1px solid blue;
      margin: 2px;

      font-size: 12px;
      line-height: 35px;
      text-align: center;
    }


    </style>

</head>
<body>

    <div id="wrap">



    <script src='https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js'></script>
    <script>
        //获取页面标签节点权限
        let oWrap = document.getElementById("wrap"),1)">定义变量初始值
            h = "";
        第一种for循环排列
        for(let i=0; i<9; i++){

            for(let j=0; j<i+1; j++ ){
                span标签拼接
                h += "<span>"+(i+1)+"*"+(j+1)+"="+(i+1)*(j+1)+"</span>";

            }
            每行标签加换行符
            h += "<br>";
        }
        添加分隔符
        h += "<hr>"

        第二种for循环
        for(let j=0; j<9-i; j++){
                span标签的拼接
                h += `<span>${9-i}*${j+1}=${(9-i)*(j+1)}</span>`;
            }
            
        }
        每行标签加换行符
        h +="<hr>"
        将拼接的标签值赋值给节点owrap
        oWrap.innerHTML  = h ;

    </script>
</body>
<!--
笔记区域




-->

</html>

99乘法表

总结


以上是前端之家为你收集整理的99乘法表全部内容,希望文章能够帮你解决99乘法表所遇到的程序开发问题。

如果觉得前端之家网站内容还不错,欢迎将前端之家网站推荐给前端开发程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。