Java教程
javascrip中字符串验证码以及练习题目以及敏感词过滤以及表单验证
本文主要是介绍javascrip中字符串验证码以及练习题目以及敏感词过滤以及表单验证，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！
验证码：验证你是否是机器人
纯数字组成的验证：非常容易破解 6位数字验证码
数字和字符组成的验证码：
0~9
a~z 97~122
A~Z 65~90
随机：0~122
方法：
1、生成一个数组，装有的单个字符，长度62数字
随机0~61的下标
2、随机ASCII码值’
//n位验证码 每一个数字的范围0~9 parseInt(Math.random()*10);
<script>
function numTestCode(n){
var arr = [];//存储生成的数字
for(var i=0;i<n;i++){
var num=parseInt(Math.random()*10);
arr.push(num);
}
return arr.join("");
}
alert(numTestCode(2));
</script>
<script>
function testCode(n){
var arr=[];
for(var i=0;i<n;i++){
var num=parseInt(Math.random()*123);
if(num>=0&&num<=9){
arr.push(num);
}else if(num>=97&&num<=122||num>=65&&num<=90){
arr.push(String.fromCharCode(num));
}else{
i--;
}
}
return arr.join("");
}
alert(testCode(6));
</script>
随机生成验证码
function testCode(n){
var arr=[];
for(var i=0;i<n;i++){
var num=parseInt(Math.random()*123);
if(num>=0&&num<=9){
arr.push(num);
}else if(num>=97&&num<=122||num>=65&&num<=90){
arr.push(String.fromCharCode(num));
}else{
i--;
}
}
return arr.join("");
}
alert(testCode(6));
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
#div1{width: 100px;height: 30px;border: 1px red solid;}
</style>
<script src='tool.js'></script>
<script>
//事件驱动函数
//通过id获取页面上对应的标签
//document.getElementById(id);
//node.innerHTML 标签间的内容
function btnClick(){
//拿到div这个标签
var oDiv=document.getElementById("div1");
//alert(oDiv.innerHTML);取值
//oDiv.innerHTML = '赋值'
oDiv.innerHTML=testCode(6);
}
</script>
</head>
<body>
<div id='div1'>000</div>
<!-- 点击按钮，就会执行后面字符串中的代码 -->
<button onclick = 'btnClick();'>获取验证码</button>
</body>
</html>
function testCode(n){
var arr=[];
for(var i=0;i<n;i++){
var num=parseInt(Math.random()*123);
if(num>=0&&num<=9){
arr.push(num);
}else if(num>=97&&num<=122||num>=65&&num<=90){
arr.push(String.fromCharCode(num));
}else{
i--;
}
}
return arr.join("");
}
alert(testCode(6));
字符串练习
(1)将字符串按照单词进行逆序，空格作为划分单词的唯一条件
传入：“Welcome to Beijing"改为”Beijing to Welcome”
<script>
/*将字符串按照单词进行逆序，空格作为划分单词的唯一条件
传入："Welcome to Beijing"改为”Beijing to Welcome"
*/
function reverseStr(str){
var arr = str.split(" ");
arr.reverse();
return arr.join(" ");
}
alert(reverseStr("Welcome to Beijing"));
</script>
(2)
对称数组
传入一个数组。其元素类型与个数皆未知，返回新数组，由原数组的元素正序反序拼接而成
传入
[“one”,“two”,“three”]
返回
[“one”,“two”,“three”,“three”,“two”,“one”]
<script>
function symmetryArr(arr){
var newArr = arr.concat();
for(var i = arr.length - 1; i >= 0; i--){
newArr.push(arr[i]);
}
return newArr;
}
alert(symmetryArr(["one","two","three"]));
</script>
(3)
已知一个字符串对象中，英语单词用各种非字母字符分割，统计单词个数
传入:“Yes,she*is%my&love.”;
返回5
【规律】当前面一个字符是字母，后面一个是非字母的时候，这就是一个单词
<script>
function countOfWord(str){
var count = 0;
for(var i = 0; i < str.length - 1; i++){
if(isABC(str[i]) && !isABC(str[i + 1])){
count++;
}
}
return count;
}
alert(countOfWord("Yes,she*is%my&love."));
//判断单个单词是否是字母
function isABC(charStr){
if(charStr >= "a" && charStr <= "z"|| charStr >= "A" && charStr <= "Z"){
return true;
}else{
return false;
}
}
</script>
(4)
实现函数，查找子串出现的次数，返回字符串str中出现的substring的次数
传入:“abcabcabc” , “abc”
返回：3
<script>
function countOfStr(supStr,subStr){
var arr = supStr.split(subStr);
return arr.length - 1;
}
alert(countOfStr("abcabcabc","abc"));
</script>
(5)
已知邮箱的用户名只能由数字字母下划线组成，域名为@1000phone.com,
判断一个字符串是否是一个邮箱，是返回true,不是返回false.com
mail@1000phone.com是
$mail@1000phone.com不是
mail@1000phone.comp不是
<script>
function isEmail(email){
//查找@符号的位置
var index = email.indexOf("@");
if(index == -1){
return false;
}else{
var endStr = email.substring(index);
if(endStr != "@1000phone.com"){
return false;
}else{
//判断用户名是否符合数字字母下划线
var username = email.substring(0,index);
var isYes = true;//假设都符合
for(var i = 0; i < username.length; i++){
if(!isDEF(username[i])){
isYes = false;
break;
}
}
return isYes;
}
}
}
//判断单个字符是否符合数字字母下划线
function isDEF(charStr){
if(charStr >= "a" && charStr <= "z" || charStr >= "A" && charStr <= "Z" || charStr >= "0" && charStr <= "9" || charStr == "_"){
return true;
}else{
return false;
}
}
alert(isEmail("mail@1000phone.com"));
</script>
字符串-敏感词过滤
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
#msg{width: 400px;height: 400px;border: 1px solid black;}
</style>
<script>
/*
敏感词过滤
表单元素，获取其中内容，通过.value的属性
双标签节点 innerHTML属性，获取标签间内容
*/
//装有敏感词
var arr = [/靠/ig,/tmd/ig,/nm/ig];
function btnClick(){
var oTxt = document.getElementById("txt1");
var oMsg = document.getElementById("msg");
var oValue = oTxt.value;
for(var i = 0; i < arr.length; i++){
oValue = oValue.replace(arr[i],"*");
}
oMsg.innerHTML = oValue;
oTxt.value = '';
}
</script>
</head>
<body>
<textarea name="" id="txt1" cols="30" rows="10"></textarea>
<button onclick = 'btnClick();'>发布</button>
<div id = 'msg'></div>
</body>
</html>
表单验证
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
#div1{width: 200px;height: 200px;background-color: lightblue;border: 1px solid black;text-align: center;}
#div1 input{width: 100px;height: 30px;font-size: 18px;margin: 10px;}
#div1 span{font-size: 14px;color: red;}
</style>
<script>
/*事件驱动函数 onclick
onblur 失去焦点
*/
function func(){
var oUsername = document.getElementById("username");
var oUsernameSpan = document.getElementById("username_span");
//1 拿到输入框的内容
var oValue = oUsername.value;
//2 判断
//《1》用户名长度是否符合要求
if(oValue.length < 6 || oValue.length > 18){
oUsernameSpan.innerHTML = "长度应为6~18个字符!";
//<2>首字母是否是字母
}else if(!isABC(oValue[0])){
oUsernameSpan.innerHTML = "邮箱地址必须以英文字母开头";
}else{
//<3>是否都是数字、字母、下划线组成
var isYes = true;//假设符合要求
for(var i = 0; i < oValue.length; i++){
if(!isDEF(oValue[i])){
isYes = false;
break;
}
}
if(isYes){
oUsernameSpan.innerHTML = "恭喜，该邮件地址可注册";
}else{
oUsernameSpan.innerHTML = "邮件地址需由数字、字母、下划线组成";
}
}
}
//判断单个字符是否是字母
function isABC(charStr){
if(charStr >= "a" && charStr <= "z" || charStr >= "A" && charStr <= "Z" ){
return true;
}else{
return false;
}
}
//判断单个字符是否符合数字字母下划线
function isDEF(charStr){
if(charStr >= "a" && charStr <= "z" || charStr >= "A" && charStr <= "Z" || charStr >= "0" && charStr <= "9" || charStr == "_"){
return true;
}else{
return false;
}
}
</script>
</head>
<body>
<div id = 'div1'>
<input id = 'username' type="text" placeholder="用户名" οnblur="func();">
<span id = 'username_span'>表单验证</span>
<input type="text" placeholder="密码">
</div>
</body>
</html>
这篇关于javascrip中字符串验证码以及练习题目以及敏感词过滤以及表单验证的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
-
JavaMailSender是什么，怎么使用？-icode9专业技术文章分享11-15
-
JWT 用户校验学习：从入门到实践11-15
-
Nest学习：新手入门全面指南11-15
-
RestfulAPI学习：新手入门指南11-15
-
Server Component学习：入门教程与实践指南11-15
-
动态路由入门：新手必读指南11-15
-
JWT 用户校验入门：轻松掌握JWT认证基础11-15
-
Nest后端开发入门指南11-15
-
Nest后端开发入门教程11-15
-
RestfulAPI入门：新手快速上手指南11-15
-
Server Action入门：新手必读教程11-15
-
Server Component入门：新手必读教程11-15
-
抽离公共代码教程：简单易懂的入门指南11-15
-
动态路由教程：轻松入门与实战指南11-15
-
Restful API教程：入门与实践指南11-15
栏目导航
