1、JavaScript编写随机四位数验证码，用到的知识点为：
a、Math对象的随机数：Math.random()
b、Math对象的取整 ：Math.floor()
c、处理所需要的下标个数，结合以上两个Math对象。
2、首先，来做几道简单的结果输出。
a、Math.random()*100；
b、Math.floor(Math.random()*100)；
c、Math.floor(Math.random()*100)%16；
相信大家前两道题很容易就能够做对。结果分别是 a、0-100之间的随机浮点数。b、0-100之间的随机整数。
那么第三道题无非就是 0-100之间的随机整数对16取余数，将会是一个什么区间呢 ？
在这里我告诉大家一个方法：
任何数字对某一个数字取余数，那么最小的余数应该是 0 本身，那么最大的余数应该是什么呢？ 答案当然是比他小 1 。
以这道题为例：100%16 最大的余数当然是 15 ， 因为余数如果是16 的话他将被整除，最终余数为0.
3、说了这么多小问题，基础题，我们学会了这些能够做什么呢？
本篇文章为大家编写 一个 随机验证码（4位数 大小写字母 数字组成）实现 随机变换颜色， 随机变换字号大小 ， 随机抽取字母数字。
/* 1、随机的颜色，随机的字号，随机的字母数字。 颜色由：0-9的数字，a-f的字母组成。 字号：以html标记font的属性1-7组成。 字母数字：小写26个字母，大写26个字母，0-9 的 数字组成。 2、创建三个数组，数组元素为以上三组。 3、4位数验证码，需要使用循环遍历，条件是4次。每次在这个循环中，我需要产生随机颜色数组长度的下标、随机字号数组颜色的下标、随机抽取字母大小写，数字样本数组的下标。 4、拼接字符串，每次生成一个font元素， color="颜色数组[随机下标]" size = "字号数组[随机下标]" 内容为：字母数字样本[随机下标] 5、输出随机字符串 */ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>4位字母验证码</title> <script type="text/javascript"> function checkCodeofRandom(){ // 所需随机抽取的样本数组 var nums=new Array("q","w","e","r","t","y","u","i","o","p","a","s","d","f","g","h","j","k","l","z","x","c","v","b","n","m","A","W","E","R","T","Y","U","I","O","P","A","S","D","F","G","H","J","K","L","Z","X","C","V","B","N","M","0","1","2","3","4","5","6","7","8","9"); // 初始化 拼接字符串 var str=""; //颜色需要的数组元素 var nums1=new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"); var n1=""; //字号需要的数组元素 var nums2=new Array("1","2","3","4","5","6","7"); var n2; for(i=0;i<4;i++){ //遍历拼接颜色色值 eg 000000 for(var j=0;j<6;j++){ var k=Math.floor(Math.random()*100)%16; n1=n1+nums1[k]; } //每次生成一个随机的字号 var o=Math.floor(Math.random()*100)%8; n2=nums2[o]; //每次生成一个0 - 61 之间的 number 作为随机获取验证码的下标 var p=Math.floor(Math.random()*1000)%62; //拼接验证码 随机颜色 随机字号 随机抽取大小写字母和数字 str+="<font color='#"+n1+"' size='"+n2+"'>"+nums[p]+"</font>" } document.getElementById("checkCode").innerHTML = str; } </script> </head> <body> <div id = 'checkCode' style="width:100px; float: left; "></div> <button id = "btn" onclick="checkCodeofRandom()">获取验证码</button> </body> </html>
本博客是博主自己研究，编写的随机验证码，请深入理解其随机思想。在此基础上可以衍生多位数验证码，或者组成元素更多的验证码。
希望广大编程爱好者的意见或者建议，转载需要注明博主地址，谢谢。