js生成随机颜色方法代码分享(三种)


Posted in Javascript onDecember 29, 2016

话不多说,请看代码

<!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>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
关于实现代码语法标亮 dp.SyntaxHighlighter
Feb 02 Javascript
点图片上一页下一页翻页效果
Jul 09 Javascript
网页前台通过js非法字符过滤代码(骂人的话等等)
May 26 Javascript
extjs中grid中嵌入动态combobox的应用
Jan 01 Javascript
JS.elementGetStyle(element, style)应用示例
Sep 24 Javascript
客户端js判断文件类型和文件大小即限制上传大小
Nov 20 Javascript
JS响应鼠标点击实现两个滑块区间拖动效果
Oct 26 Javascript
JS实现旋转木马式图片轮播效果
Jan 18 Javascript
使用AngularJS2中的指令实现按钮的切换效果
Mar 27 Javascript
JavaScript中常见内置函数用法示例
May 14 Javascript
如何检查一个对象是否为空
Apr 11 Javascript
分享8个JavaScript库可更好地处理本地存储
Oct 12 Javascript
js实现把图片的绝对路径转为base64字符串、blob对象再上传
Dec 29 #Javascript
jQuery实现6位数字密码输入框
Dec 29 #Javascript
JQuery统计input和textarea文字输入数量(代码分享)
Dec 29 #Javascript
jQuery中的siblings()是什么意思(推荐)
Dec 29 #Javascript
JQuery获取鼠标进入和离开容器的方向
Dec 29 #Javascript
jQuery实现遮罩层登录对话框
Dec 29 #Javascript
JS实现的简易拖放效果示例
Dec 29 #Javascript
You might like
30个php操作redis常用方法代码例子
2014/07/05 PHP
php操作(删除,提取,增加)zip文件方法详解
2015/03/12 PHP
PHP的APC模块实现上传进度条
2015/10/27 PHP
yii2使用gridView实现下拉列表筛选数据
2017/04/10 PHP
php生成毫秒时间戳的实例讲解
2017/09/22 PHP
基于JQuery实现的Select级联
2014/01/27 Javascript
jQuery操作select下拉框的text值和value值的方法
2014/05/31 Javascript
Mac OS X 系统下安装和部署Egret引擎开发环境
2014/09/03 Javascript
有效提高JavaScript执行效率的几点知识
2015/01/31 Javascript
jQuery选择器源码解读(五):tokenize的解析过程
2015/03/31 Javascript
JavaScript中的lastIndexOf()方法使用详解
2015/06/06 Javascript
jQuery easyui的validatebox校验规则扩展及easyui校验框validatebox用法
2016/01/18 Javascript
jQuery ajax全局函数处理session过期后的ajax跳转问题
2016/06/03 Javascript
js实现的页面加载完毕之前loading提示效果完整示例【附demo源码下载】
2016/08/02 Javascript
简单实现js选项卡切换效果
2017/02/09 Javascript
JS高仿抛物线加入购物车特效实现代码
2017/02/20 Javascript
js实现百度登录框鼠标拖拽效果
2017/03/07 Javascript
微信小程序开发之实现自定义Toast弹框
2017/06/08 Javascript
JS实现简易的图片拖拽排序实例代码
2017/06/09 Javascript
Angular HMR(热模块替换)功能实现方法
2018/04/04 Javascript
vue 路由嵌套高亮问题的解决方法
2018/05/17 Javascript
Vue 中axios配置实例详解
2018/07/27 Javascript
[47:55]Ti4第二日主赛事败者组 NaVi vs EG 1
2014/07/20 DOTA
[03:15]DOTA2-DPC中国联赛1月22日Recap集锦
2021/03/11 DOTA
pygame学习笔记(4):声音控制
2015/04/15 Python
简单掌握Python中glob模块查找文件路径的用法
2016/07/05 Python
Python实现批量检测HTTP服务的状态
2016/10/27 Python
Python机器学习库scikit-learn安装与基本使用教程
2018/06/25 Python
Python Switch Case三种实现方法代码实例
2020/06/18 Python
python中的yield from语法快速学习
2020/11/06 Python
canvas之自定义头像功能实现代码示例
2017/09/29 HTML / CSS
canvas探照灯效果的示例代码
2018/11/30 HTML / CSS
2014小学数学教研组工作总结
2014/12/06 职场文书
特岗教师个人总结
2015/02/10 职场文书
2016年教师师德师风心得体会
2016/01/12 职场文书
浅谈Redis的几个过期策略
2021/05/27 Redis