1、概念

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>正则表达式</title>
</head>
<body>
</body>
<script type="text/javascript">
//RegExp对象 //创建正则对象方式1
//参数1 正则表达式(不能有空格)
//参数2 匹配模式:常用g(全局匹配;找到所有匹配,而不是第一个匹配后停止)和i(忽略大小写吧) var str = 'hello World';
var reg1 = new RegExp('e','ig');
console.log(reg1) //2.字面量方式创建
var reg2 = /o/gi;//检测字符e,不区分大小写,全局匹配 //正则对象提供的检索方式
//test() 检测字符串中是否包含定义字符模式,返回布尔
//要检索的字符在字符串str中 返回true
console.log(reg2.test(str)); //2.2 exec() 具体执行匹配,返回数组
console.log(reg2.lastIndex); // 2 保存一次匹配时开始的下标
console.log(reg2.exec(str)); //["o", index: 7, input: "hello world"]
console.log(reg2.lastIndex); //2 //3.常用方法
//match
var reg3 = /d/g; console.log(str.match(reg3)) //2.replace替换: str.replace(被替换的,替换的)
console.log(str.replace(reg3,'*')); //3.search()
console.log(str.search(reg3));//查询字符串在字符中出现的位置 下标 //4.split()
console.log(str.split(reg3)); </script>
</html>

2、元字符

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>元字符</title>
<script>
window.onload = function (){
//元字符
//1.单个字符和数字
//1 . 匹配除换行符以为的任意字符
var str = "oweb";
var reg = /./g;
console.log(reg.exec(str));
var str = "www/baidu/com";
var reg = /www\......\.com/g; //如果想不让字符有其他意义 转义\
console.log(reg.exec(str)); //2. [] 匹配[]里面的任意一个字符
var str1 = "4awebadsads";
var reg1 = /[a-zA-Z0-9]/g; // 匹配字母还是数字
console.log(reg1.exec(str1)); var str2 = "1s34";
var reg2 = /[0-9][0-9][0-9]/g;
console.log(reg2.exec(str2)); //3. [^] 所有不在这个范围内的字符
var str3 = "abd";
var reg3 = /[^a-z]/g; //匹配除小写字母以外的任意字符
console.log(reg3.exec(str3)); //4. \
var str4 = "web";
var reg4 = /\d/g; //匹配数字
var reg5 = /\D/g; //非数字
console.log(reg4.exec(str4)); //null
console.log(reg5.exec(str4)); //w var reg6 = /\w/g; //匹配数字 字母 下划线_
var reg7 = /\W/g; //匹配除数字 字母 下划线以外的任意字符
console.log(reg6.exec(str4)); //w
console.log(reg7.exec(str4)); //null var reg8 = /\s/g; //空格
var reg9 = /\S/g; //非空白字符
console.log(reg8.exec(str4)); //null
console.log(reg9.exec(str4)); //w //5 锚字符 ^以什么开头 $以什么结尾
var str = "www.";
var reg10 = /^www/g; // ^字符
console.log(reg10.exec(str)); var reg11 = /www\.$/g; //字符$
console.log(reg11.exec(str)); //重复的字符
//? 匹配前面的字符0个或一个 ,
var strs = "webr44546ere";
var reg12 = /[0-9]?/g;
console.log(reg12.exec(strs)); //* 匹配0个或任意多个字符 尽可能多的匹配
var reg13 = /[a-z]*/g; //匹配小写字母,0个或多个
console.log(reg13.exec(strs)); //+ 至少匹配一次
var reg14 = /\d+/g;
console.log(reg14.exec(strs)); //{4}
var stra = "";
var rega = /^1\d{10}$/g; //匹配连续的四个数字
console.log(rega.exec(stra)); //{1,4} 最少一个最多4个
var strb = "edg";
var regb = /^[a-zA-z]{2,3}$/g;
console.log(regb.exec(strb)); //|| 竖线 或者
var strc = "www.google"; //baidu google ujiuye
var regc = /www.baidu|google|ujiuye/g;
console.log(regc.exec(strc)); //() 分组
var strc = "www.google"; //baidu google ujiuye
var regc = /www.(baidu)|(google)|(ujiuye)/g;
console.log(regc.exec(strc)); console.log(RegExp.$1);
console.log(RegExp.$2);
console.log(RegExp.$3); var str = "helloworld";
var reg = /(hello)(world)/g;
/* console.log(reg.exec(str));
console.log(RegExp.$1);*/
console.log(str.replace(reg,"$2 $1")); }
</script>
</head>
<body> </body>
</html>

3、相关练习

http://www.w3school.com.cn/jsref/jsref_obj_regexp.asp

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>正则表达式相关练习</title>
</head>
<body>
<script type="text/javascript"> //正则表达式练习 http://www.w3school.com.cn/jsref/jsref_obj_regexp.asp window.onload = function () {
//1.检索字符串中是否不包含字母
var str = '';
var reg1 = /[^a-zA-Z]/g;
console.log(reg1.test(str));
if(reg1.test(str)){
console.log('不包含');
}else{
console.log('包含');
} //2.去除字符串首尾空格
var str2 = ' hello world! ';
//开头的空格
var reg =/^\s+/ig; // + 1到多次!
var str3 = str2.replace(reg,""); var reg2 = /\s+$/ig;
var str4 = str3.replace(reg2,"");
console.log("|"+str4+"|"); //3.检查用户账号
function checkUser(str) {
var re = /^[a-zA-Z]\w{3,15}$/ig;
if(re.test(str)){
console.log('正确')
}else{
console.log('错误')
}
}
checkUser('alex_haha'); //4.手机号码 11位数字以1开头
function checkMobile(str) {
var re = /^1\d{10}$/ig;
if(re.test(str)){
console.log('正确')
}else{
console.log('错误')
}
}
checkMobile('');
checkMobile(''); //5.电话号码 区号+号码 区号以0开头 3位或4位
// 号码由7位或8位数字组成
// 区号与号码之间可以无连接符,也可以"-"连接
function checkPhone(str) {
var re = /^0\d{2,3}-?\d{7,8}$/ig;
if(re.test(str)){
console.log('正确')
}else{
console.log('错误')
}
}
checkPhone("095-12345678"); //6.邮箱
//规则:第一部分@第二部分
//第一部分:由字母 数字 下划线 短线 - 点号 . 组成
//第二部分:为一个域名 域名由 字母 数字 短线 短线 - 域名后缀组成
// 域名后缀一般为 .xxx 或者 .xxx.xx 一区的域名后缀一般为 2-4 位,如cn,
function checkEmail(str) {
var re = /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/ig;
if(re.test(str)){
console.log('正确')
}else{
console.log('错误')
}
}
checkEmail('alex@cnbolgs.cn'); } </script>
</body>
</html>

前端-javascript-正则表达式的更多相关文章

  1. web前端篇:JavaScript正则表达式

    目录 JavaScript正则表达式 1.创建正则表达式 1.1方法1:直接量语法 1.2 方法2:创建RegExp对象的语法 1.3 区别: 1.4正则表达式使用 2.正则对象的属性 2.1.属性 ...

  2. web前端学习(四)JavaScript学习笔记部分(10)-- JavaScript正则表达式

    1.JavaScript正则表达式课程概要 方便查找字符串.数字.特殊字串等等 2.正则表达式的介绍 RegExp是正则表达式的缩写 当检索某个文本时,可以使用一种模式来描述要检索的内容.RegExp ...

  3. JavaScript正则表达式下——相关方法

    上篇博客JavaScript 正则表达式上——基本语法介绍了JavaScript正则表达式的语法,有了这些基本知识,可以看看正则表达式在JavaScript的应用了,在一切开始之前,看看RegExp实 ...

  4. JavaScript正则表达式学习笔记(二) - 打怪升级

    本文接上篇,基础部分相对薄弱的同学请移步<JavaScript正则表达式学习笔记(一) - 理论基础>.上文介绍了8种JavaScript正则表达式的属性,本文还会追加介绍几种JavaSc ...

  5. javascript 正则表达式补充

    定义 JavaScript种正则表达式有两种定义方式,定义一个匹配类似 <%XXX%> 的字符串 1. 构造函数 var reg=new RegExp('<%[^%>]+%&g ...

  6. 前端- JavaScript - 总结

    1.JavaScript的介绍 javaScript是一种web前端的描述语言,也是一种基于对象(object)和事件驱动(Event Driven)的.安全性好的脚本语言. 它运行在客户端从而减轻服 ...

  7. JavaScript正则表达式及jQuery回顾

    JavaScript 正则表达式,用于规定在文本中检索的内容. 一.定义正则表达式: rep = /\d+/; // js定义正则.(python定义正则:re模块 rep = "\d+&q ...

  8. JavaScript正则表达式,你真的知道?

    一.前言 粗浅的编写正则表达式,是造成性能瓶颈的主要原因.如下: var reg1 = /(A+A+)+B/; var reg2 = /AA+B/; 上述两个正则表达式,匹配效果是一样的,但是,效率就 ...

  9. 【JS】javascript 正则表达式 大全 总结

    javascript 正则表达式 大全 总结 参考整理了一些javascript正则表达式 目的一:自我复习归纳总结 目的二:共享方便大家搜索 微信:wixf150 验证数字:^[0-9]*$ 验证n ...

  10. 理清JavaScript正则表达式--上篇

    在JavaScript中,正则表达式由RegExp对象表示.RegExp对象呢,又可以通过直接量和构造函数RegExp两种方式创建,分别如下: //直接量 var re = /pattern/[g | ...

随机推荐

  1. SQL Server 中关于EXCEPT和INTERSECT的用法

    熟练使用SQL Server中的各种用法会给查询带来很多方便.今天就介绍一下EXCEPT和INTERSECT.注意此语法仅在SQL Server 2005及以上版本支持. EXCEPT是指在第一个集合 ...

  2. MVC5 + EF6 + Bootstrap3系列教程

    本系列教程以ASP.NET MVC5为核心框架,使用Entity Framewok6访问数据,并使用Bootstrap3作为前端UI框架.帮助大家开发出一套高效.美观.稳定.实用的软件系统. MVC5 ...

  3. C语言面试题2

    预处理 问题1:什么是预编译?何时需要预编译? 答:预编译又称预处理,是整个编译过程最先做的工作,即程序执行前的一些预处理工作.主要处理#开头的指令.如拷贝#include包含的文件代码.替换#def ...

  4. tomcat源码阅读之部署器

    我们知道web应用是用Context实例表示的,而Context是部署到Host实例中的,因此tomcat的部署器是关联的Host实例.Context实例可以用WAR文件部署,也可以把整个web应用的 ...

  5. 无人驾驶之激光雷达&摄像头(主要from 速腾CEO 邱纯鑫分享)

    无人驾驶之激光雷达&摄像头 (from 速腾CEO 邱纯鑫公开课分享) 根据听的一些讲座和看的书籍,个人感觉:目前现在的自动驾驶,根本问题还是在于感知(路况,周边物体,交通标识等等),控制的方 ...

  6. 【python】globle的使用

    python中直接定义的变量就是本地变量,使用global定义的变量就是全局变量.比如: a = 1 b = 1 def foo1(): global b #申明使用全局b a = 2 #a是本地变量 ...

  7. keepalived配置主从备份

    keepalived配置主从备份   keepalived是一个用于做双机热备(HA)的软件,常和haproxy联合起来做热备+负载均衡,达到高可用. 运行原理 keepalived通过选举(看服务器 ...

  8. ASP.NET网站权限设计实现(二)——角色权限绑定

    1.关于使用的几张表的说明  (1)Module:模块表,记录模块名称.编码等模块基本数据.   (2)Permissions:权限表,记录所有模块权限distinct之后的数据.   (3)Modu ...

  9. OpenFileDialog 打开快捷方式时,返回的是快捷方式引用的路径,而不是快捷方式(.lnk)自身的路径

    OpenFileDialog 打开 .lnk 文件. OpenFileDialog 有个DereferenceLinks 属性:获取或设置一个值,该值指示文件对话框是返回快捷方式引用的文件的位置,还是 ...

  10. Neo4j在Centos7下的安装笔记

    首先,要在官网找到tar的安装包路径,然后使用wget来安装.下载之后解压. 然后运行 bin/neo4j start 就可以启动了. 启动之后防火墙开放7474,发现仍然访问不了. 因为这里和win ...