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

　　

js几种生成随机颜色方法的更多相关文章

  1. JS七种加密解密方法

    http://www.cnblogs.com/mq0036/p/4983858.html HTML或JS加密解密 本文一共介绍了七种方法:   一:最简单的加密解密   二:转义字符"\&q ...

  2. js几种数组遍历方法.

    第一种:普通的for循环 ; i < arr.length; i++) { } 这是最简单的一种遍历方法,也是使用的最多的一种,但是还能优化. 第二种:优化版for循环 ,len=arr.len ...

  3. 原生Js 两种方法实现页面关键字高亮显示

    原生Js 两种方法实现页面关键字高亮显示 上网看了看别人写的,不是兼容问题就是代码繁琐,自己琢磨了一下用两种方法都可以实现,各有利弊. 方法一 依靠正则表达式修改 1.获取obj的html2.统一替换 ...

  4. 2.32 js几种定位方法总结

    2.32 js几种定位方法总结 前言本篇总结了几种js常用的定位元素方法,并用js点击按钮,对input输入框输入文本 一.以下总结了5种js定位的方法除了id是定位到的是单个element元素对象, ...

  5. js一种继承机制：用对象冒充继承构造函数的属性，用原型prototype继承对象的方法。

    js一种继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法. function ClassA(sColor) { this.color = sColor; } ClassA ...

  6. jquery动态加载js三种方法实例

    这里为你提供了三种动态加载js的jquery实例代码哦,由于jquery是为用户提供方便的,所以利用jquery动态加载文件只要一句话$.getScript(\"test.js\" ...

  7. js处理的8种跨域方法

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

  8. JS去掉首尾空格 简单方法大全(原生正则jquery)

    JS去掉首尾空格 简单方法大全 var osfipin= ' http://www.cnblogs.com/osfipin/ '; //去除首尾空格 osfipin.replace(/(^\s*)|( ...

  9. js弹出对话框的方法总结

    九种js弹出对话框的方法总结,需要的朋友可以参考一下 [1.最基本的js弹出对话框窗口代码] 这是最基本的js弹出对话框,其实代码就几句非常简单: <script LANGUAGE=" ...

随机推荐

  1. v14.0\AspNet\Microsoft.Web.AspNet.Props 找不到

    错误 E:\Github\AutoMapper\src\AutoMapper\AutoMapper.CoreCLR.kproj : error  : 未找到导入的项目"C:\Program ...

  2. Mono 3.8发布：性能进一步改进，可伸缩性提升

    9月4日,Mono 3.8.0发布了.该版本的运行时带来了一些性能和可伸缩性方面的改进,同时完成了向Windows平台的移植. Mono遵循Gnome和Linux内核的版本编号策略,这意味着3.8是3 ...

  3. [翻译]Orchard如何工作

    Orchard一直是博主心中神一般的存在,由于水平比较菜,Orchard代码又比较复杂看了几次都不了了之了.这次下定决心要搞懂其工作原理,争取可以在自己的项目中有所应用.为了入门先到官网去学习一下相关 ...

  4. H5嵌入原生开发小结----兼容安卓与ios的填坑之路

    一开始听说开发H5,以为就是做适配现代浏览器的移动网页,心想不用管IE了,欧也.到今天,发现当初too young too simple,兼容IE和兼容安卓与IOS,后者让你更抓狂.接下来数一下踩过的 ...

  5. Atitit MATLAB 图像处理 经典书籍attilax总结

    Atitit MATLAB 图像处理 经典书籍attilax总结 1.1. MATLAB数字图像处理1 1.2. <MATLAB实用教程(第二版)>((美)穆尔 著)[简介_书评_在线阅读 ...

  6. ZeroMQ：云时代极速消息通信库

    ZeroMQ:云时代极速消息通信库(大规模|可扩展|低成本|高效率解决之道,大规模分布式|多线程应用程序|消息传递架构构建利器) [美]Pieter Hintjens(皮特.亨特金斯)著   卢涛 李 ...

  7. iOS-----正则表达式的基础语法

    正则表达式简单语法总结 一.什么是正则表达式 从概念上来说,正则表达式也是一门小巧而精炼的语言,它可以用来简化检索特定的字符串,替换特定字符等功能,有许多开发语言工具,都内嵌支持正则表达式.那么一个正 ...

  8. 使用Red Gate Sql Data Compare 数据库同步工具进行SQL Server的两个数据库的数据比较、同步

    Sql Data Compare 是比较两个数据库的数据是否相同.生成同步sql的工具. 这一款工具由Red Gate公司出品,我们熟悉的.NET Reflector就是这个公司推出的,它的SQLTo ...

  9. 窥探Vue.js 2.0

    title: 窥探Vue.js2.0 date: 2016-09-27 10:22:34 tags: vue category: 技术总结 --- 窥探Vue.js2.0 令人兴奋的Vue.js 2. ...

  10. Golang 生成随机数

    package main import ( "fmt" "math/rand" "time" ) func main() { rand.Se ...