js随机颜色生成

来源：互联网发布：哈登什么数据是第一编辑：程序博客网时间：2024/05/02 00:53

说明
随机生成不同颜色，可根据具体需求，综合使用

示例

<!DOCTYPE html><html lang="en"><head>    <meta charset="utf-8">    <title>@yield('title')</title>    <style>        .div_box {            width:200px;            height:100px;            text-align: center;            padding-top:50;            font-size:14px;            background-color: #000;        }        .div_a {            width:120px;            height:40px;            color:#fff;        }    </style></head><body>    <div class="div_box" id="div_box">        <a href="javascript:void(0)" onclick="change();" class="div_a">点击改变背景</a>    </div>    <script type="text/javascript" src="js/jquery.js"></script>    <script type="text/javascript">    function change() {        var str = '#';        var i = 0;        for (i; i < 6; i++) {            var randNum = parseInt(Math.random()*15);            switch (randNum) {                case 10:                    randNum = 'A';                    break;                case 11:                    randNum = 'B';                    break;                case 12:                    randNum = 'C';                    break;                case 13:                    randNum = 'D';                    break;                case 14:                    randNum = 'E';                    break;                case 15:                    randNum = 'F';                    break;            }            str += randNum;        }        var div_box = window.document.getElementById('div_box');        div_box.style.backgroundColor = str;    }    </script></body></html>

效果如下
点击前：
这里写图片描述

点击后：
这里写图片描述

参考文档：
https://mp.weixin.qq.com/s?__biz=MzA3NTUzNjk1OA==&mid=402794692&idx=1&sn=a7656055c5b7cb2a2849841acba5a9f0#rd

阅读全文

1 0