jQuery獲取隨機顏色的實例代碼
更新時間:2018年05月21日 10:59:47 作者:The_road_of_ordinary
這篇文章主要介紹了jQuery獲取隨機顏色的實例代碼,非常不錯,具有一定的參考借鑒價值,感興趣的朋友跟隨腳本之家小編來學習吧
1.js
//獲取十六進制顏色 function randomColor1(){ var r = Math.floor(Math.random()*256); var g = Math.floor(Math.random()*256); var b = Math.floor(Math.random()*256); if(r < 16){ r = "0"+r.toString(16); }else{ r = r.toString(16); } if(g < 16){ g = "0"+g.toString(16); }else{ g = g.toString(16); } if(b < 16){ b = "0"+b.toString(16); }else{ b = b.toString(16); } return "#"+r+g+b; } $("h3").css("color",randomColor1());
2.html
.<h3>獲取任意顏色</h3>
效果:
下面在看一段代碼關于js幾種生成隨機顏色方法
<!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>
總結
以上所述是小編給大家介紹的jQuery獲取隨機顏色的實例代碼,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持!
相關文章
ASP中進行HTML數(shù)據及JS數(shù)據編碼函數(shù)
在有些時候我們無法控制亂碼的出現(xiàn), 比如發(fā)送郵件的時候有些郵件顯示亂碼, 比如Ajax返回數(shù)據總是亂碼. 怎么辦?2009-11-11javascript 使用sleep函數(shù)的常見方法詳解
這篇文章主要介紹了javascript 使用sleep函數(shù)的常見方法,結合實例形式分析總結了javascript sleep函數(shù)的功能、常見使用方法與操作注意事項,需要的朋友可以參考下2020-04-04