JavaScript随机生成颜色的方法


Posted in Javascript onOctober 15, 2016

废话不多说了直接给大家贴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>

以上所述是小编给大家介绍的JavaScript随机生成颜色的方法,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的,在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript各种复制代码收集
Sep 20 Javascript
举例讲解JavaScript中关于对象操作的相关知识
Nov 16 Javascript
页面向下滚动ajax获取数据的实现方法(兼容手机)
May 24 Javascript
限制复选框最多选择项的实现代码
May 30 Javascript
微信小程序 数组(增,删,改,查)等操作实例详解
Jan 05 Javascript
利用ES6语法重构React组件详解
Mar 02 Javascript
微信小程序中的onLoad详解及简单实例
Apr 05 Javascript
Node.js利用debug模块打印出调试日志的方法
Apr 25 Javascript
JS运动特效之任意值添加运动的方法分析
Jan 24 Javascript
JavaScript深拷贝和浅拷贝概念与用法实例分析
Jun 07 Javascript
基于jquery实现九宫格拼图小游戏
Nov 30 jQuery
对vue生命周期的深入理解
Dec 03 Vue.js
js实现目录链接,内容跟着目录滚动显示的简单实例
Oct 15 #Javascript
js控制div层的叠加简单方法
Oct 15 #Javascript
js实现table添加行tr、删除行tr、清空行tr的简单实例
Oct 15 #Javascript
js控制li的隐藏和显示实例代码
Oct 15 #Javascript
jquery控制页面的展开和隐藏实现方法(推荐)
Oct 15 #Javascript
JS常用函数和常用技巧小结
Oct 15 #Javascript
表单元素值获取方式js及java方式的简单实例
Oct 15 #Javascript
You might like
php设计模式之简单工厂模式详解
2014/09/04 PHP
php打印输出棋盘的实现方法
2014/12/23 PHP
php+javascript实现的动态显示服务器运行程序进度条功能示例
2017/08/07 PHP
laravel validate 设置为中文的例子(验证提示为中文)
2019/09/29 PHP
javascript 简练的几个函数
2009/08/29 Javascript
一个简单的JavaScript数据缓存系统实现代码
2010/10/24 Javascript
解决ExtJS在chrome或火狐中正常显示在ie中不显示的浏览器兼容问题
2013/01/11 Javascript
IE、FF浏览器下修改标签透明度
2014/01/28 Javascript
jquery scroll()区分横向纵向滚动条的方法
2014/04/04 Javascript
JavaScript数组常用方法
2015/03/02 Javascript
详解jQuery中的empty、remove和detach
2016/04/11 Javascript
JavaScript的Vue.js库入门学习教程
2016/05/23 Javascript
详解angularJs中自定义directive的数据交互
2017/01/13 Javascript
Vue.js实战之使用Vuex + axios发送请求详解
2017/04/04 Javascript
w3c编程挑战_初级脚本算法实战篇
2017/06/23 Javascript
windows下更新npm和node的方法
2017/11/30 Javascript
JS判断用户用的哪个浏览器实例详解
2018/10/09 Javascript
详解vue中使用transition和animation的实例代码
2020/12/12 Vue.js
python实现2048小游戏
2015/03/30 Python
读写json中文ASCII乱码问题的解决方法
2016/11/05 Python
python获取当前用户的主目录路径方法(推荐)
2017/01/12 Python
python dict 字典 以及 赋值 引用的一些实例(详解)
2017/01/20 Python
利用python爬取软考试题之ip自动代理
2017/03/28 Python
python 内置模块详解
2019/01/01 Python
python-pyinstaller、打包后获取路径的实例
2019/06/10 Python
PyQt5根据控件Id获取控件对象的方法
2019/06/25 Python
Python解压 rar、zip、tar文件的方法
2019/11/19 Python
Python3监控疫情的完整代码
2020/02/20 Python
Python telnet登陆功能实现代码
2020/04/16 Python
详解pandas绘制矩阵散点图(scatter_matrix)的方法
2020/04/23 Python
python实现坦克大战
2020/04/24 Python
苹果台湾官网:Apple台湾
2019/01/05 全球购物
旅游管理专业大学生职业规划书
2014/02/27 职场文书
舞出我人生观后感
2015/06/16 职场文书
趣味运动会通讯稿
2015/07/18 职场文书
特别篇动画《总之就是非常可爱 ~制服~》PV公开,2022年夏季播出
2022/04/04 日漫