<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#code {
width: 100px;
height: 50px;
background-color: lightblue;//颜色可以改变
font-size:44px;//设置出来字体大小
letter-spacing:5px;//设置字体间距
}
</style>
</head>
<body>
<script>
function RandCode() {
let chars = ['a','b','c','1','2','3'];//可以打上qwer等只不过比较麻烦
let randcode = "";//这里我觉的是需要数组去存放随机产生的代码
for (let i = 0; i < 3; i++) {//这行是控制出来的随机代码是几位的,如果想要增加把数字3改掉即可,响应的CSS代码里面width代码也要变大或者减小,位数由自己来定
let randpos = Math.floor(Math.random() * chars.length);
randcode += chars[randpos];
}
document.getElementById("code").innerHTML = randcode;//读取数组
}
</script>
<div id="code"></div>
<button onclick="RandCode()">验证码</button>
</body>
</html>
这里是运用《Web前端开发》孙俏 里面的题目,如果需要26位的可以在chars数组里面敲