JS打印彩色菱形的實例代碼
更新時間:2018年08月15日 16:25:13 作者:Weirdo-world
本文通過一段簡單的實例代碼給大家介紹js實現(xiàn)打印彩色菱形的方法,非常不錯,具有一定的參考借鑒價值,需要的朋友參考下吧
效果圖如下所示:
具體代碼如下所示:
<!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>
總結(jié)
以上所述是小編給大家介紹的JS打印彩色菱形的實例代碼,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
JavaScript中具名函數(shù)的多種調(diào)用方式總結(jié)
這篇文章主要介紹了JavaScript中具名函數(shù)的多種調(diào)用方式總結(jié),本文總結(jié)了4種方法,需要的朋友可以參考下2014-11-11JavaScript實現(xiàn)body內(nèi)任意節(jié)點的自定義屬性功能示例
這篇文章主要介紹了JavaScript實現(xiàn)body內(nèi)任意節(jié)點的自定義屬性功能,涉及javascript針對DOM節(jié)點的獲取及屬性設置相關(guān)操作技巧,需要的朋友可以參考下2017-09-09echarts柱狀堆疊圖實現(xiàn)示例(圖例和x軸都是動態(tài)的)
一些柱形圖在數(shù)據(jù)量比較多的時候,橫向排列受到擠壓,導致柱形圖,變的非常細,影響整體的效果,下面這篇文章主要給大家介紹了關(guān)于echarts柱狀堆疊圖(圖例和x軸都是動態(tài)的)的相關(guān)資料,需要的朋友可以參考下2023-04-04純js網(wǎng)頁畫板(Graphics)類簡介及實現(xiàn)代碼
今天需要在網(wǎng)頁上畫一個圖譜,想到用JS,經(jīng)過學習,和網(wǎng)上搜索,經(jīng)過整理優(yōu)化得到下面代碼,注意不是用HTML5的canvas,而是用的純js,需要了解的朋友可以參考下2012-12-12深入淺析ES6 Class 中的 super 關(guān)鍵字
本文給大家收藏整理了ES6 Class 中的 super 關(guān)鍵字,非常不錯,具有參考借鑒價值,需要的朋友參考下吧2017-10-10javascript實現(xiàn)checkbox全選的代碼
本文給大家分享的是js實現(xiàn)checkbox的全選的代碼,在網(wǎng)頁制作中很常用的js代碼,供大家學習參考。2015-04-04