javascript正则表达式入门
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> RegExp对象</title>
<script>
/*function validation(obj){
//1.得到文本框的值
//var name = document.getElementById("username").value;
var name = obj.value;
//2.定义一个正则表达式
var regexp = new RegExp("[a-zA-Z]{6,10}");
//3.匹配
var bvalue = regexp.test(name);
//4.判断
if(bvalue){
alert("用户名格式正确");
}else{
alert("用户名格式错误,只能6-10位字母组成");
}
}*/ //调用函数规则一般:事件名="函数名()"
//onclick:点击
//onblur:失去焦点 onblur="validation(this)" this代表当前的标签
//onfocus:得到焦点 //即时的消息提示
function validationsw(obj){
//1.得到文本框的值
//var name = document.getElementById("username").value;
var name = obj.value;
//2.定义一个正则表达式
var regexp = new RegExp("^[a-zA-Z]{6,10}$");
//3.匹配
var bvalue = regexp.test(name);
//根据id找到div
var errorsw = document.getElementById("errorMsg");
//4.判断
//innerHTML代表的是<div></div>中间的文本,而且能识别html标签
//innerText:代表的是<div></div>中间的文本,但不能识能html标签
if(bvalue){
errorsw.innerHTML="<font color='red'>用户名格式正确</font>"; }else{
errorsw.innerHTML="<font color='red'>用户名格式错误,只能6-10位字母组成</font>";
}
} function clearText(objhsw){
var hswvalue = objhsw.value;
if(hswvalue == "只能6-10位字母组成"){
objhsw.value="";
}
}
function changeChar(obj){
var source = obj.value;
if(source!="只能是6-10位的字母组成"){
var regExp = new RegExp("^[a-zA-Z]{6,10}$");
flag = regExp.test(source);
} var errorsw = document.getElementById("errorMsg2"); if(!flag){
errorsw.innerHTML = "<font color='red'>只能是6-10位的字母组成</font>";
}else{
errorsw.innerHTML = "<font color='green'>ok</font>";
}
} </script>
</head> <body> <input type="text" value="只能6-10位字母组成" id="username" name="username" onfocus="clearText(this)" onblur="validationsw(this)" />
<div id="errorMsg" style="display:inline;"></div> <hr size="3cm" color="blue"/> <input id="source" type="text" value="只能是6-10位的字母组成" size="30" onchange="changeChar(this)" />
<div id="errorMsg2" style="display:inline;"></div> </body>
</html>
javascript正则表达式入门的更多相关文章
- javascript正则表达式入门先了解这些
前言 此内容由学习<JavaScript正则表达式迷你书(1.1版)>整理而来(于2020年3月30日看完).此外还参考了MDN上关于Regex和String的相关内容,还有ECMAScr ...
- 正则系列——JavaScript正则表达式入门心得
我发现有个别字符被这个编辑器给刷掉了,但是灰色区域显示正常,以灰色区域代码为准 什么玩意? 在我刚开始学习编程的时候,就听过正则了,也听说正则很牛逼,懂正则的更牛逼.但是苦于没有人指点,也没有使用正则 ...
- JavaScript 正则表达式入门教程
正则表达式是描述一组字符串特征的模式,用来匹配特定的字符串 主要分三个部分:基本语法.RegExp对象的方法.JS中支持正则表达式的String对象方法 一.基本语法 在JS中,正则表达式为对象,用如 ...
- JavaScript正则表达式详解(一)正则表达式入门
JavaScript正则表达式是很多JavaScript开发人员比较头疼的事情,也很多人不愿意学习,只是必要的时候上网查一下就可以啦~本文中详细的把JavaScript正则表达式的用法进行了列表,希望 ...
- 正则表达式入门教程&&经典Javascript正则表达式(share)
前言 例子: ^.+@.+\\..+$ 这样的代码曾经多次把我自己给吓退过.可能很多人也是被这样的代码给吓跑的吧.继续阅读本文将让你也可以自由应用这样的代码. 正文 教程:正则表达式30分钟入门教程 ...
- 正则表达式基于JavaScript的入门详解
关于正则表达式,和很多前辈聊起这个知识点时,他们的反馈都比聊其他技术谦逊,而和很多刚入门的程序员讨论时甚至会有觉得你看不起他. 的确,正则表达式从通常的应用来看,的确不难,比如电话,邮箱等验证.语法, ...
- 正则表达式入门教程&&经典Javascript正则表达式----share
前言 例子: ^.+@.+\\..+$ 这样的代码曾经多次把我自己给吓退过.可能很多人也是被这样的代码给吓跑的吧.继续阅读本文将让你也可以自由应用这样的代码. 正文 教程:正则表达式30分钟入门教程 ...
- 正则表达式入门教程&&经典Javascript正则表达式
前言 例子: ^.+@.+\\..+$ 这样的代码曾经多次把我自己给吓退过.可能很多人也是被这样的代码给吓跑的吧.继续阅读本文将让你也可以自由应用这样的代码. 正文 教程:正则表达式30分钟入门教程 ...
- javascript 正则表达式 详细入门教程
1.什么是正则表达式 定义: 一个用来搜索.匹配.处理一些符合特定语法规则的一个强大的字符串处理工具. 用途: 进行特定字符和字符串的搜索 替换字符串中指定的字符或字符串 验证字符串是否符合需求 2. ...
随机推荐
- 基于CAS的SSO(单点登录)实例
第一步 部署CAS-Server(服务端) 1.从CAS官方网站(http://developer.jasig.org/cas/)下载最新版本的CAS-Server(当前最新版本cas-server- ...
- 转:【Java集合源码剖析】HashMap源码剖析
转载请注明出处:http://blog.csdn.net/ns_code/article/details/36034955 您好,我正在参加CSDN博文大赛,如果您喜欢我的文章,希望您能帮我投一票 ...
- Java中equals和==之间的区别
今天在写表达式求值的时候,发现了equals和==||!=和!equals()之间是不一样的. 我就从网上搜了搜关于这方面的知识,然后在下面做一个总结: Java中有两类数据类型: 基本数据类型(Pr ...
- 201521123048《Java程序设计》第6周学习总结
1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 2. 书面作业 1.clone方法 1.1 Object对 ...
- 201521123057 《Java程序设计》 第6周学习总结
1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 2. 书面作业 1.clone方法 1.1 Object对 ...
- 201521123110 《Java程序设计》第6周学习总结
1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 2. 书面作业 1.clone方法 1.1 Object对 ...
- 201521123122 《java程序设计》 第六周实验总结
201521123122 <java程序设计>第六周实验总结 1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想 ...
- 201521123004《Java程序设计》第4周学习总结
1. 本周学习总结 1.1 尝试使用思维导图总结有关继承的知识点. 1.2 使用常规方法总结其他上课内容. 本周主要内容为: 继承:extends 抽取共同特征(行为与属性) 复用代码 继承时子类将获 ...
- 201521123101 《Java程序设计》第1周学习总结
1. 本周学习总结 在学习Java之前要做好准备工作,了解Java从研发后开始如何一步步完善,其与C++.C语言的异同,然后下载JDK.Eclipse.Notepad等软件,以便于未来的学习. 2. ...
- Java课程设计——学生基本信息管理
1.团队名称.团队成员介绍 团队名称:学生基本信息管理设计小组 团队成员:花雨芸(组长)--负责管理界面的编写 丁蓉(组员)--负责登陆的设计编写 2.项目git地址 https://git.osch ...