Js-好玩的随机色

1、随机公式

var random = Math.random()*(max-min)+min

1.1、有了随机公式我们就可以来封装随机颜色

function randomColor(){
            let random = '#'
            for(let i=0; i<6; i++){
                random += parseInt(Math.random() * 15).toString(16)  //随机数取整，并转换成16进制
            }
            return random    //返回随机数
        }

随机颜色1.png

1.2、咋们封装两个获取元素的函数

( $ = s => document.querySelector(s))()  //就是自调用函数
function $$(s){ return document.querySelectorAll(s) }

1.3、给按钮添加点击事件（点击按钮，div盒子变色）

$('button').onclick = function(){
            Array.from($$('div')).forEach(ele => {  
                let bunch = randomColor()
                Object.assign(ele.style,{      //  Object.assign将多个对象合并到一个身上
                    background: bunch
                })
                ele.innerHTML = `<p>${bunch}</p>`  //还是显示一下吧
            });
        }

最后的效果如下 ↓

随机色.gif