js實現(xiàn)驗證碼干擾(靜態(tài))
更新時間:2021年02月22日 16:50:17 作者:lzh~
這篇文章主要為大家詳細介紹了js實現(xiàn)驗證碼干擾,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
本文實例為大家分享了js實現(xiàn)驗證碼干擾的具體代碼,供大家參考,具體內(nèi)容如下
效果
代碼
<!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'); //獲得繪畫環(huán)境 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); //獲得像素點的個數(shù) var dian=alldata.data.length/4; for(var i=0;i<10000;i++){ //取隨機數(shù) 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); } //將數(shù)據(jù)寫回畫板 cv.putImageData(alldata,0,0); </script> </body> </html>
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
您可能感興趣的文章:
相關(guān)文章
CocosCreator ScrollView優(yōu)化系列之分幀加載
這篇文章主要介紹了CocosCreator ScrollView的優(yōu)化,從分幀加載進行了講解,對性能優(yōu)化感興趣的同學,一定要看一下2021-04-04用按鈕控制iframe顯示的網(wǎng)頁實現(xiàn)方法
在iframe中顯示的網(wǎng)頁已經(jīng)是一件平凡無奇的事了,不過可能依然有很多的童鞋沒不知所措吧,沒關(guān)系,因為本文的出現(xiàn)將會帶你脫離苦海,感性的朋友可以了解下啊,或許對你有所幫助2013-02-02編寫更好的JavaScript條件式和匹配條件的技巧(小結(jié))
這篇文章主要介紹了編寫更好的JavaScript條件式和匹配條件的技巧(小結(jié)),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2019-06-06Bootstrap fileinput 上傳新文件移除時觸發(fā)服務器同步刪除的配置
這篇文章主要介紹了Bootstrap fileinput 上傳新文件移除時觸發(fā)服務器同步刪除的配置 ,需要的朋友可以參考下2018-10-10詳解JavaScript中Generator函數(shù)的使用
Generator 是 ES6 新增的一種函數(shù)類型,這篇文章主要來和大家詳細聊聊Generator函數(shù)的具體用法,文中的示例代碼講解詳細,感興趣的可以了解一下2023-06-06