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随机生成颜色的方法,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的,在此也非常感谢大家对澳门金沙网上娱乐网站的支持!

相关文章

  • 让AJAX不依赖后端接口实现方案

    让AJAX不依赖后端接口实现方案

    网页中的ajax请求越来越多,或者应用开始就一直使用ajax与后端进行数据交换,本文将详细介绍,需要的朋友可以参考下
    2012-12-12
  • js截取字符串的两种方法及区别详解

    js截取字符串的两种方法及区别详解

    本文是对js截取字符串的两种方法及区别进行了详细的介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-11-11
  • 基于JSONP原理解析(推荐)

    基于JSONP原理解析(推荐)

    下面小编就为大家推荐一篇基于JSONP原理解析,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2017-12-12
  • js中回调函数的学习笔记

    js中回调函数的学习笔记

    这篇文章主要介绍了js中回调函数的相关知识,需要的朋友可以参考下
    2014-07-07
  • XMLHttpRequest对象_Ajax异步请求重点(推荐)

    XMLHttpRequest对象_Ajax异步请求重点(推荐)

    下面小编就为大家带来一篇XMLHttpRequest对象_Ajax异步请求重点(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-09-09
  • js实现简单的可切换选项卡效果

    js实现简单的可切换选项卡效果

    这篇文章主要介绍了js实现简单的可切换选项卡效果的方法,涉及javascript操作css样式实现切换选项卡的技巧,非常具有实用价值,需要的朋友可以参考下
    2015-04-04
  • 扒一扒JavaScript 预解释

    扒一扒JavaScript 预解释

    这篇文章主要介绍了JavaScript 预解释,包含带var关键字预解释、带function关键字预解释,需要的朋友可以参考下
    2015-01-01
  • JS 调试中常见的报错问题解决方法

    JS 调试中常见的报错问题解决方法

    下面小编就为大家带来一篇JS 调试中常见的报错问题解决方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-05-05
  • coffeescript使用的方式汇总

    coffeescript使用的方式汇总

    而来到CoffeeScript的世界,美妙故事再次上演。在写了几行代码后我相信你将不会再想念原生的Javascript了。CoffeeScript包含了许多新特性,当将它与jQuery,node.js,javascript结合时,你会发现一片新天地。
    2015-08-08
  • JavaScript搜索字符串并将搜索结果返回到字符串的方法

    JavaScript搜索字符串并将搜索结果返回到字符串的方法

    这篇文章主要介绍了JavaScript搜索字符串并将搜索结果返回到字符串的方法,涉及javascript中match方法操作字符串的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-04-04

最新评论