JavaScript随机生成颜色的方法

 更新时间:2016年10月15日 15:37:29   作者:li_han  
这篇文章主要介绍了JavaScript随机生成颜色的方法的相关资料,非常不错,代码简单易懂,具有参考借鉴价值,需要的朋友可以参考下

废话不多说了直接给大家贴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随机生成颜色的方法,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的,在此也非常感谢大家对脚本之家网站的支持!

相关文章

  • JSON字符串转JSON对象

    JSON字符串转JSON对象

    本文给大家分享的是如何使用javascript实现JSON字符串转JSON对象的方法,这里记录下来,有需要的小伙伴可以参考下。
    2015-07-07
  • 微信公众平台开发教程(四) 实例入门:机器人回复(附源码)

    微信公众平台开发教程(四) 实例入门:机器人回复(附源码)

    本篇文章主要介绍了微信公众平台开发机器人,可以实现简单对话和查询天气等,有需要的可以了解一下。
    2016-12-12
  • 微信小程序实现图片滚动效果示例

    微信小程序实现图片滚动效果示例

    这篇文章主要介绍了微信小程序实现图片滚动效果,结合实例形式分析了微信小程序基于swiper组件的图片滚动效果相关实现技巧与操作注意事项,需要的朋友可以参考下
    2018-12-12
  • javascript实现复选框选中属性

    javascript实现复选框选中属性

    本文给大家介绍的是一篇国外网友写的博客,讲解的是关于实现复选框选中属性的问题,感觉非常不错,翻译过来推荐给大家,希望小伙伴们能够喜欢。
    2015-03-03
  • js判断一个对象是否在一个对象数组中(场景分析)

    js判断一个对象是否在一个对象数组中(场景分析)

    这篇文章主要介绍了js判断一个对象是否在一个对象数组中,本文通过场景分析给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
    2022-08-08
  • JavaScript鼠标禁止右键禁止打开控制台及键盘禁用

    JavaScript鼠标禁止右键禁止打开控制台及键盘禁用

    这篇文章主要给大家介绍了关于JavaScript鼠标禁止右键禁止打开控制台及键盘禁用的相关资料,实现禁止右键和禁止打开控制台是一种常见的网页保护技巧,可以防止非法复制、盗取网页资源等安全问题,需要的朋友可以参考下
    2023-10-10
  • Django模板继承 extend标签实例代码详解

    Django模板继承 extend标签实例代码详解

    这篇文章主要介绍了Django模板继承 extend标签实例代码,非常不错,具有一定的参考借鉴价值 ,需要的朋友可以参考下
    2019-05-05
  • js动态创建、删除表格示例代码

    js动态创建、删除表格示例代码

    生成一个2000*5的表格,每个单元格的内容是行号+逗号+列号,具体的实现过程如下,感兴趣的朋友可以参考下,希望对大家有所帮助
    2013-08-08
  • JavaScript hasOwnProperty() 函数实例详解

    JavaScript hasOwnProperty() 函数实例详解

    hasOwnProperty()函数用于指示一个对象自身(不包括原型链)是否具有指定名称的属性。下面通过本文给大家分享JavaScript hasOwnProperty() 函数实例讲解,感兴趣的朋友一起看看吧
    2017-08-08
  • javascript原生ajax写法分享

    javascript原生ajax写法分享

    本文通过2个示例来给大家分享了下原生javascript结合ajax实现数据请求的方法以及原理,非常的简单实用,有需要的小伙伴可以参考下
    2016-04-04

最新评论