利用 Math.random() 实现通过随机数产生随机的颜色的简单方法

导读:本篇文章讲解 利用 Math.random() 实现通过随机数产生随机的颜色的简单方法,希望对大家有帮助,欢迎收藏,转发!站点地址:www.bmabk.com

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>随机产生颜色</title>
  <style>
    div {
      width: 200px;
      height: 200px;
	  border-radius:50%;
	  left: 0;
	  right:0;
	  top:0;
	  bottom: 0;
	  margin: auto;
	  position: absolute;
    }
  </style>
  <script>
    //随机产生一个十六进制的颜色值
    //封装成一个函数
    console.log(parseInt(Math.random() * 5));

    function getColor() {
      var str = "#";
      //定义一个十六进制的值的数组
      var lzp = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f"];
       
	  // 遍历循环产生 6 个数
      for (var i = 0; i < 6; i++) {
        //随机产生 0~15 的个索引数,然后根据该索引找到数组中对应的值,拼接到一起
        var lut = parseInt(Math.random() * 16);
        str += lzp[lut];
      }
      return str;
    }
    //页面记载的事件
    window.onload = function () {
      //在文档中通过id属性的值查找这个元素(标签).设置该标签的背景颜色
      document.getElementById("tt").style.backgroundColor = getColor();
    };
    //console.log(getColor());
	
	

  </script>

</head>
<body>
<div id="tt"></div>

</body>
</html>

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/66434.html

(0)
小半的头像小半

相关推荐

极客之音——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!