JS打印彩色菱形的实例代码

2019-11-19 13:14:49

字体：大中小

来源：转载

供稿：网友

效果图如下所示：

具体代码如下所示：

<!DOCTYPE html><html lang="zh-CN"><head>  <meta charset="UTF-8">  <title>weirdo</title>  <style>    * {      margin: 0;      padding: 0;      box-sizing: border-box;    }    .lx {      text-align: center;      letter-spacing: 5px;      margin: 20px;    }  </style></head><body><div class="lx">  <script>    function cl() {      var c = '0123456789abcdef';      var cc = '#';      cc += c.charAt(Math.round(Math.random() * (c.length - 1)));      cc += c.charAt(Math.round(Math.random() * (c.length - 1)));      cc += c.charAt(Math.round(Math.random() * (c.length - 1)));      cc += c.charAt(Math.round(Math.random() * (c.length - 1)));      cc += c.charAt(Math.round(Math.random() * (c.length - 1)));      cc += c.charAt(Math.round(Math.random() * (c.length - 1)));      return cc;    }    function ling(num) {      for (var i = 1; i <= num; i += 2) {        document.write('<p class="ling">');        for (var j = 1; j <= i; j++) {          document.write('<span style="color:' + cl() + '">*</span>');        }        document.write('</p>');      }      for (var i = num; i >= 1; i -= 2) {        document.write('<p class="ling">');        for (var j = 1; j <= i; j++) {          document.write('<span style="color:' + cl() + '">*</span>');        }        document.write('</p>');      }    }    ling(15);  </script></div></body></html>

总结

以上所述是小编给大家介绍的JS打印彩色菱形的实例代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对武林网网站的支持！

上一篇：深入理解Vue router的部分高级用法

下一篇：layui点击按钮添加可编辑的一行方法