JavaScript

超轻量级php框架startmvc

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

更新时间:2020-07-21 13:12 作者:startmvc
效果图如下所示:具体代码如下所示:<!DOCTYPEhtml><htmllang="zh-CN"><head><metachars

效果图如下所示:

具体代码如下所示:


<!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打印彩色菱形的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!