點擊div隨機變色

時間 2020-04-17

標籤點擊 div 隨機變色欄目 CSS 简体版

原文原文鏈接

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4   <meta charset="UTF-8">
 5   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6   <title>Document</title>
 7   <style>
 8     #box {
 9       width: 200px;
10       height: 200px;
11       background: red;
12     }
13   </style>
14 </head>
15 <body>
16   <div id="box"></div>
17   <script>
18     var box = document.getElementById('box')
19     box.onclick = function () {
20       // 生成一個隨機顏色
21       var str = '0123456789abcdef'
22       var color = '#'
23       for (var i = 0; i < 6; i++) {
24         var index = Math.floor(Math.random() * str.length)
25         color += str[index]
26       }
27       console.log(color)
29       box.style.background = color
30     }
31   </script>
32 </body>
33 </html>

相關標籤/搜索