js几种生成随机颜色方法

<!DOCTYPE html>

<html>

<head lang="en">

<meta charset="UTF-8">

<title></title>

</head>

<body>

<button id="btn1">调用第一种</button>

<button id="bnt2">调用第二种</button>

<button id="btn3">调用第三种</button>

<script>

var btn1=document.getElementById('btn1');

btn1.onclick=function(){

document.body.style.background=bg1()

};

var btn2=document.getElementById('bnt2');

btn2.onclick=function(){

document.body.style.background=bg2();

};

var btn3=document.getElementById('btn3');

btn3.onclick=function(){

document.body.style.background=bg3();

};

function bg1(){

return '#'+Math.floor(Math.random()*256).toString(10);

}

function bg2(){

return '#'+Math.floor(Math.random()*0xffffff).toString(16);

}

function bg3(){

var r=Math.floor(Math.random()*256);

var g=Math.floor(Math.random()*256);

var b=Math.floor(Math.random()*256);

return "rgb("+r+','+g+','+b+")";//所有方法的拼接都可以用ES6新特性`其他字符串{$变量名}`替换

}

</script>

</body>

</html>

转载于:https://www.cnblogs.com/libin-1/p/5972266.html

js几种生成随机颜色方法相关推荐

js两种拼接字符串方法
js两种拼接字符串方法 function(msgArr) {//参数为一个数组,每一个对象为图片id和图片地址var len = msgArr.length;//第一种拼接方式,直接用"+& ...
JS七种加密解密方法
HTML或JS加密解密本文一共介绍了七种方法: 一:最简单的加密解密二:转义字符"\"的妙用三:使用Microsoft出品的脚本编码器Script Encoder ...
php怎样随机设置颜色,php简单生成随机颜色的方法
本文实例讲述了php简单生成随机颜色的方法.分享给大家供大家参考,具体如下: "; //第二种方法: printf( "#%06X\n", mt_rand( 0, 0xF ...
day01 js三种导入html的方法、js书写规范、变量的基本使用、变量提升
昨天是初学js的第一天,为什么今天才写,我觉得这样可以帮助我复习昨天的知识,加深对js的理解. 我之前学过java的,昨天转入js的学习,对js略有些体会和大家分享下,js刚入门感觉js相对于java ...
十分钟，学会使用js三种方法创建本地json数据文件
前言在干业务时,需要得到一份全国省市到街道的区划数据,刚好业务中连接了高德地图,高德地图又提供了区划的api,这下只需要把数据写到json里了.什么!你说你还不会用js创建json文件?没关系,只需 ...
2.32 js几种定位方法总结
2.32 js几种定位方法总结前言本篇总结了几种js常用的定位元素方法,并用js点击按钮,对input输入框输入文本一.以下总结了5种js定位的方法除了id是定位到的是单个element元 ...
js对象转数组的方法一种方法
js对象转数组的方法一种方法 let obj = { name: '张三', age: 18, sex: '男' };let a = Object.values(obj) //属性值 // ['张三' ...
web前端js基础之js的几种“截取字符串”方法
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
js两种方法删除对象属性
js 两种方法删除对象属性 delete 语法 delete 对象.属性名示例 delete.obj.property1 不过据说很慢,不如下面的方法. Reflect.deleteProperty ...

js几种生成随机颜色方法

js几种生成随机颜色方法相关推荐

最新文章

热门文章