js几种生成随机颜色方法
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | <!DOCTYPE html> <html> <head lang= "en" > <meta charset= "UTF-8" > <title></title> </head> <body> <button id= "btn1" >调用第一种</button> <button id= "bnt2" >调用第二种</button> <button id= "btn3" >调用第三种</button> <script> var btn1=document.getElementById( 'btn1' ); btn1.onclick= function (){ document.body.style.background=bg1() }; var btn2=document.getElementById( 'bnt2' ); btn2.onclick= function (){ document.body.style.background=bg2(); }; var btn3=document.getElementById( 'btn3' ); btn3.onclick= function (){ document.body.style.background=bg3(); }; function bg1(){ return '#' +Math.floor(Math.random()*256).toString(10); } function bg2(){ return '#' +Math.floor(Math.random()*0xffffff).toString(16); } function bg3(){ var r=Math.floor(Math.random()*256); var g=Math.floor(Math.random()*256); var b=Math.floor(Math.random()*256); return "rgb(" +r+ ',' +g+ ',' +b+ ")" ; //所有方法的拼接都可以用ES6新特性`其他字符串{$变量名}`替换 } </script> </body> </html> |
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步