js实现验证码干扰(静态)


Posted in Javascript onFebruary 22, 2021

本文实例为大家分享了js实现验证码干扰的具体代码,供大家参考,具体内容如下

效果

js实现验证码干扰(静态)

代码

<!DOCTYPE html>
<html>
 <head>
 <meta charset="UTF-8">
 <title></title>
 <style>
  *{
  padding: 0;
  margin: 0;
  }
  canvas{
  background: #272822;
  }
 </style>
 </head>
 <body>
 <canvas id='canvas' width='800' height='500'></canvas>
 <script>
  //获得画板
  var canvas=document.getElementById('canvas');
  //获得绘画环境
  var cv=canvas.getContext('2d');
  
  cv.fillStyle='#272822';
  cv.fillRect(0,0,800,500);
  cv.font='80px 微软雅黑';
  cv.fillStyle='greenyellow';
  cv.fillText( Math.floor(Math.random()*10000),200,200);
  
  //获得所有的图像像素点信息
  var alldata=cv.getImageData(0,0,800,500);
  //获得像素点的个数
  var dian=alldata.data.length/4;
  for(var i=0;i<10000;i++){
  //取随机数
  var num=Math.floor(Math.random()*dian);
  //计算像素点对应的四条信息从几号开始
  var start=(num-1)*4;
  alldata.data[start]=Math.floor(Math.random()*256);
  alldata.data[start+1]=Math.floor(Math.random()*256);
  alldata.data[start+2]=Math.floor(Math.random()*256);
  }
  //将数据写回画板
  cv.putImageData(alldata,0,0);
 </script>
 </body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
tbody元素支持嵌套的注意方法
Mar 24 Javascript
Packer 3.0 JS压缩及混淆工具 下载
May 03 Javascript
使用PHP+JavaScript将HTML页面转换为图片的实例分享
Apr 18 Javascript
通用无限极下拉菜单的实现代码
May 31 Javascript
js每隔两秒输出数组中的一项(实例)
May 28 Javascript
angular 用拦截器统一处理http请求和响应的方法
Jun 08 Javascript
基于JavaScript实现百度搜索框效果
Jun 28 Javascript
JS canvas绘制五子棋的棋盘
May 28 Javascript
浅谈Vue数据响应思路之数组
Nov 06 Javascript
详解离线安装npm包的几种方法
Nov 25 Javascript
深入浅析vue全局环境变量和模式
Apr 28 Javascript
vue 实现click同时传入事件对象和自定义参数
Jan 29 Vue.js
JavaScript实现H5接金币功能(实例代码)
Feb 22 #Javascript
nestjs返回给前端数据格式的封装实现
Feb 22 #Javascript
NestJs使用Mongoose对MongoDB操作的方法
Feb 22 #Javascript
linux服务器快速卸载安装node环境(简单上手)
Feb 22 #Javascript
k8s node节点重新加入master集群的实现
Feb 22 #Javascript
js实现简单图片拖拽效果
Feb 22 #Javascript
用vite搭建vue3应用的实现方法
Feb 22 #Vue.js
You might like
PHP安装攻略:常见问题解答(二)
2006/10/09 PHP
php 启动时报错的简单解决方法
2014/01/27 PHP
PHP中使用break跳出多重循环代码实例
2015/01/21 PHP
PHP中生成UUID自定义函数分享
2015/06/10 PHP
Yii使用DbTarget实现日志功能的示例代码
2020/07/21 PHP
jQuery 源码分析笔记(3) Deferred机制
2011/06/19 Javascript
javascript比较两个日期的先后示例代码
2014/12/31 Javascript
JS+CSS实现的竖向简洁折叠菜单效果代码
2015/10/22 Javascript
jQuery操作基本控件方法实例分析
2015/12/31 Javascript
JS实现给json数组动态赋值的方法示例
2020/03/19 Javascript
浅谈在Vue-cli里基于axios封装复用请求
2017/11/06 Javascript
NodeJS 实现多语言的示例代码
2018/09/11 NodeJs
Vue 打包体积优化方案小结
2020/05/20 Javascript
JS实现小米轮播图
2020/09/21 Javascript
写一个Vue loading 插件
2020/11/09 Javascript
Python实现类继承实例
2014/07/04 Python
python写的一个squid访问日志分析的小程序
2014/09/17 Python
Python实现的拟合二元一次函数功能示例【基于scipy模块】
2018/05/15 Python
Python中函数参数调用方式分析
2018/08/09 Python
pyqt远程批量执行Linux命令程序的方法
2019/02/14 Python
Python进程,多进程,获取进程id,给子进程传递参数操作示例
2019/10/11 Python
Pycharm 使用 Pipenv 新建的虚拟环境(图文详解)
2020/04/16 Python
django rest framework 自定义返回方式
2020/07/12 Python
wedgwood加拿大官网:1759年成立的英国国宝级陶瓷餐具品牌
2018/07/17 全球购物
家得宝官网:The Home Depot(全球最大的家居装饰专业零售商)
2018/12/17 全球购物
.NET面试10题
2014/02/24 面试题
酒店服务与管理毕业生求职信
2013/11/02 职场文书
建材业务员岗位职责
2013/12/08 职场文书
工程招投标邀请书
2014/01/30 职场文书
忠诚教育心得体会
2014/09/03 职场文书
感谢信的格式
2015/01/21 职场文书
上班迟到检讨书
2015/05/06 职场文书
2015年企业员工工作总结范文
2015/05/21 职场文书
《确定位置》教学反思
2016/02/18 职场文书
pycharm debug 断点调试心得分享
2021/04/16 Python
使用Nginx搭载rtmp直播服务器的方法
2021/10/16 Servers