点击按钮生成随机颜色

思路:

        1.按钮

        2.绑定事件

        3.各种方法

        4.拼接方法

<input type="button" value="按钮">
    <script>
        class colors{
            constructor(){
                //获取按钮页面节点
                this.body = this.$("body");
                this.btn = this.$("input");
                //绑定按钮监听事件
                this.btn.addEventListener("click",this.clickFn.bind(this));
            }
            //点击事件
            clickFn(){
                let color = this.getColor();
                //设置背景颜色
                this.body.style.background = color;
            }
            //获取颜色方法(原理:拼接六个被十六进制转换的随机0-15的数)
            getColor(){
                let color = "#";
                for(let i=0 ; i<6 ; i++){
                    color += this.getRandom(0,15).toString(16);
                }
                return color;
            }
            //获取随机数方法(获取两个数之间的随机数)
            getRandom(min,max){
                return Math.round(Math.random()*(max-min)+min);
            }
            //绑定节点方法
            $(tag){
                return document.querySelector(tag);
            }
        }
        new colors
    </script>