周末总结正则表达式(完整篇)

hi

又到周末,结果这周没有电影去看,正好练练正则表达式吧,暖暖手

1、正则表达式-完结篇

---工具类开发---

<?php /* * PHP 正则表达式工具类 * 描述:进行正则表达式匹配,有常用的正则表达式以及允许用户自定义正则表达式进行匹配 */ class regexTool{ //定义常用正则表达式,并用数组对的方式存储 private $validate=array( 'require' => '/.+/', 'email' => '/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/', 'url' => '/^http(s?):\/\/(?:[A-za-z0-9-]+\.)+[A-za-z]{2,4}(?:[\/\?#][\/=\?%\-&~`@[\]\':+!\.#\w]*)?$/', 'currency' => '/^\d+(\.\d+)?$/', 'number' => '/^\d+$/', 'zip' => '/^\d{6}$/', 'integer' => '/^[-\+]?\d+$/', 'double' => '/^[-\+]?\d+(\.\d+)?$/', 'english' => '/^[A-Za-z]+$/', 'qq' => '/^\d{5,11}$/', 'mobile' => '/^1(3|4|5|7|8)\d{9}$/', ); //定义其他属性 private $returnMatchResult=false; //返回类型判断 private $fixMode=null; //修正模式 private $matches=array(); //存放匹配结果 private $isMatch=false; //构造函数,实例化后传入默认的两个参数 public function __construct($returnMatchResult=false,$fixMode=null){ $this->returnMatchResult=$returnMatchResult; $this->fixMode=$fixMode; } //判断返回结果类型,为匹配结果matches还是匹配成功与否isMatch,并调用返回方法 private function regex($pattern,$subject){ if(array_key_exists(strtolower($pattern), $this->validate)) $pattern=$this->validate[$pattern].$this->fixMode; //判断后再连接上修正模式作为匹配的正则表达式 $this->returnMatchResult ? preg_match_all($pattern, $subject,$this->matches): $this->isMatch=preg_match($pattern, $subject)===1; return $this->getRegexResult(); } //返回方法 private function getRegexResult(){ if($this->returnMatchResult){ return $this->matches; }else{ return $this->isMatch; } } //允许用户自定义切换返回类型 public function toggleReturnType($bool=null){ if(empty($bool)){ $this->returnMatchResult=!$this->returnMatchResult; }else{ $this->returnMatchResult=is_bool($bool) ? $bool : (bool)$bool; } } //下面则是数据验证方法 public function setFixMode($fixMode) { $this->fixMode = $fixMode; } public function noEmpty($str) { return $this->regex('require', $str); } public function isEmail($email) { return $this->regex('email', $email); } public function isMobile($mobile) { return $this->regex('mobile', $mobile); } public function check($pattern, $subject) { return $this->regex($pattern, $subject); } }

实例化进行验证

<?php /* * PHP 正则表达式验证文件 */ //包含类定义文件 require_once 'regexTool.class.php'; $regex=new regexTool(); $regex->setFixMode('U'); //设定修正模式为懒惰模式U $r=$regex->isEmail('asdfads@qq.com'); show($r); //使用之前学过的show函数来进行验证 /* * Description:PHP 正则表达式函数 * * @name:show * @description:output debug * @param $var:input data * @return void * */ function show($var=null){ if(empty($var)){ echo 'null'; }elseif(is_array($var)||is_object($var)){ //array,object echo '<pre>'; print_r($var); echo '</pre>'; }else{ //string,int,float... echo $var; } } ---验证表单--- 即使用方法之一 html写文件如下 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset="> <title>用户注册</title> </head> <body> <form action="regCheck.php" method="post"> 用户名<INPUT type="text" name="username" id="username" value="" /><br/><br/> email<INPUT type="text" name="email" id="email" value="" /><br/><br/> 手机号<INPUT type="text" name="mobile" id="mobile" value="" /><br/><br/> <INPUT type="submit" value="注册" /> </form> </body> </html>

相对应的在regCheck.php中改

if(!$regex->noEmpty($_POST['username'])) exit('用户名为空');

---仿(山寨版)smarty简易模板引擎---

--允许程序猿分前端后端分开开发

--模板引擎工作原理:获取模板源文件,编译模板,输出给用户(也就是联系起前后端,做“接口”一样)

--模式单元:总模式,即$pattern;子模式,即()中的东西,即一个自定义的原子,也成为模式单元

具体应用中,preg_match_all会匹配到两种模式

preg_match_all结果为二维数组,其中$matches[0][0]为总模式

其他为子模式

--

2、jQuery

---简介---

JQuery是继prototype之后又一个优秀的Javascript库。它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器(IE 6.0+, FF1.5+, Safari 2.0+, Opera 9.0+),jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML(标准通用标记语言下的一个应用)、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需要定义id即可。
jQuery是一个兼容多浏览器的javascript库,核心理念是write less,do more(写得更少,做得更多)。jQuery在2006年1月由美国人John Resig在纽约的barcamp发布,吸引了来自世界各地的众多JavaScript高手加入,由Dave Methvin率领团队进行开发。如今,jQuery已经成为最流行的javascript库,在世界前10000个访问最多的网站中,有超过55%在使用jQuery。
jQuery是免费、开源的,使用MIT许可协议。jQuery的语法设计可以使开发者更加便捷,例如操作文档对象、选择DOM元素、制作动画效果、事件处理、使用Ajax以及其他功能。除此以外,jQuery提供API让开发者编写插件。其模块化的使用方式使开发者可以很轻松的开发出功能强大的静态或动态网页。

jQuery,顾名思义,也就是JavaScript和查询(Query),即是辅助JavaScript开发的库。(摘选自百度百科)

--环境搭建

下载1.9.0稳定版本,保存在本地就好,然后再用javascript的时候包含进就行了
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>

--初体验

jQuery就是js的函数封装,形成库(私以为其更利于对付对象)
相比于原JS,它一般来说更简便

<!DOCTYPE html> <html> <head> <title>#id选择器</title> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script> </head> <body> <div>div的内容</div> <div>Hello world!</div> <script type="text/javascript"> $(" div ").html("Hello iMooc!"); //填写相应代码 </script> </body> </html>

这里$()表示匹配一定字符内的元素

---基础选择器---

--#id选择器

<div id="divtest">div的内容</div> <div id="default"></div> <script type="text/javascript"> $("#default").html($("#divtest").html());//在id号为“default”的元素中显示id号为“divtest”元素的内容。 </script>

基本使用方法是$("#id")

--element选择器

根据元素的名称可以查找到该元素,并调用css()、attr()等方法设置对所取元素的操作。

--.class选择器

根据类的名称选择元素,其他操作类似

<div class="red">立正,向我这边看齐</div> <div class="green">我先歇歇脚</div> <script type="text/javascript"> var $redHTML = $(".red").html(); $(".green").html($redHTML); </script>

--*选择器

选择器中的参数就一个“*”,既没有“#”号,也没有“.”号。 由于该选择器的特殊性,它常与其他元素组合使用,表示获取其他元素中的全部子元素。

实践证明,由于使用*选择器获取的是全部元素,因此,有些浏览器将会比较缓慢,这个选择器也需要谨慎使用。

<form action="#"> <input id="Button1" type="button" value="button" /> <input id="Text1" type="text" /> <input id="Radio1" type="radio" /> <input id="Checkbox1" type="checkbox" /> </form> <script type="text/javascript"> $("form *").attr("disabled", "true"); </script>

--sele1,sele2,seleN选择器

有时需要精确的选择任意多个指定的元素,类似于从文具盒中挑选出多根自已喜欢的笔,就需要调用sele1,sele2,seleN选择器,它的调用格式如下:

$(“sele1,sele2,seleN”)

其中参数sele1、sele2到seleN为有效选择器,每个选择器之间用“,”号隔开,它们可以是之前提及的各种类型选择器,如$(“#id”)、$(“.class”)、$(“selector”)选择器等。

<div class="red">选我吧!我是red</div> <div class="green">选我吧!我是green</div> <div class="blue">选我吧!我是blue</div> <script type="text/javascript"> $(".red,.green").html("hi,我们的样子很美哦!"); </script>

--ance desc选择器

本节开始,我们将介绍层次性选择器。

在实际应用开发中,常常是多个元素嵌套在一起,形成复杂的层次关系,通过层次选择器,可以快速定位某一层次的一个或多个元素,ance desc选择器就是其中之一,它的调用格式如下:

$("ance desc")

其中ance desc是使用空格隔开的两个参数。ance参数(ancestor祖先的简写)表示父元素;desc参数(descendant后代的简写)表示后代元素,即包括子元素、孙元素等等。两个参数都可以通过选择器来获取。比如家族姓氏“div”,家族几代人里,都有名字里带“span”的,就可以用这个ance desc选择器把这几个人给定位出来。

<div>码农家族 <p> <label></label> </p> <label></label> </div> <script type="text/javascript"> $("div label").css("background-color","blue"); </script>

--parent>child选择器

与上一节介绍的ance desc选择器相比,parent > child选择器的范围要小些,它所选择的目标是子集元素,相当于一个家庭中的子辈们,但不包括孙辈,它的调用格式如下:

$(“parent > child”)

child参数获取的元素都是parent选择器的子元素,它们之间通过“>”符号来表示一种层次关系。

<div> 码农家族 <p> <label></label> </p> <label></label> <label></label> </div> <label></label> <script type="text/javascript"> $("div>label").css("border", "solid 5px red"); </script>

--prev+next选择器

俗话说“远亲不如近邻”,而通过prev + next选择器就可以查找与“prev”元素紧邻的下一个“next”元素,格式如下:

$(“prev + next”)

其中参数prev为任何有效的选择器,参数“next”为另外一个有效选择器,它们之间的“+”表示一种上下的层次关系,也就是说,“prev”元素最紧邻的下一个元素由“next”选择器返回的并且只返回唯的一个元素。

<div> 码农家族 <label></label> <p></p> <label></label> <label></label> </div> <label></label> <script type="text/javascript"> $("p+label").css("background-color","red"); </script>

注意,这里的next是要输入下一个要找的分类器标识,不是直接输入next

--prev~siblings选择器

与上一节中介绍的prev + next层次选择器相同,prev ~ siblings选择器也是查找prev 元素之后的相邻元素,但前者只获取第一个相邻的元素,而后者则获取prev 元素后面全部相邻的元素,它的调用格式如下:

$(“prev ~ siblings”)

其中参数prev与siblings两者之间通过“~”符号形成一种层次相邻的关系,表明siblings选择器获取的元素都是prev元素之后的同辈元素。

<div> 码农家族 <label></label> <p></p> <label></label> <label></label> </div> <label></label> <script type="text/javascript"> $("p~label").css("border", "solid 1px red"); $("p~label").html("我们都是p先生的粉丝"); </script>

---过滤性选择器---

--:first/:last过滤选择器

本章我们介绍过滤选择器,该类型的选择器是根据某过滤规则进行元素的匹配,书写时以“:”号开头,通常用于查找集合元素中的某一位置的单个元素。

在jQuery中,如果想得到一组相同标签元素中的第1个元素该怎样做呢?

在下面的示例代码中你可能注意到我们会使用

$(“li:first”)

注意:书写时以“:”号开头。

<div>改变最后一行"苹果"背景颜色:</div> <ol> <li>葡萄</li> <li>香蕉</li> <li>橘子</li> <li>西瓜</li> <li>苹果</li> </ol> <script type="text/javascript"> $("li:last").css("background-color", "red"); </script>

--:eq(index)过滤选择器

如果想从一组标签元素数组中,灵活选择任意的一个标签元素,我们可以使用

:eq(index)

其中参数index表示索引号(即:一个整数),它从0开始,如果index的值为3,表示选择的是第4个元素

<div>改变中间行"葡萄"背景颜色:</div> <ol> <li>橘子</li> <li>香蕉</li> <li>葡萄</li> <li>苹果</li> <li>西瓜</li> </ol> <script type="text/javascript"> $("li:eq(2)").css("background-color", "#60F"); </script>

--:contains(text)过滤选择器

与上一节介绍的:eq(index)选择器按索引查找元素相比,有时候我们可能希望按照文本内容来查找一个或多个元素,那么使用:contains(text)选择器会更加方便, 它的功能是选择包含指定字符串的全部元素,它通常与其他元素结合使用,获取包含“text”字符串内容的全部元素对象。其中参数text表示页面中的文字。

<div>改变包含"jQuery"字符内容的背景色:</div> <ol> <li>强大的"jQuery"</li> <li>"javascript"也很实用</li> <li>"jQuery"前端必学</li> <li>"java"是一种开发语言</li> <li>前端利器——"jQuery"</li> </ol> <script type="text/javascript"> $("li:contains('jQuery')").css("background", "green"); </script>

--:has(selector)过滤选择器

除了在上一小节介绍的使用包含的字符串内容过滤元素之外,还可以使用包含的元素名称来过滤,:has(selector)过滤选择器的功能是获取选择器中包含指定元素名称的全部元素,其中selector参数就是包含的元素名称,是被包含元素。

<div>改变包含"label"元素的背景色:</div> <ol> <li><p>我是P先生</p></li> <li><label>L妹纸就是我</label></li> <li><p>我也是P先生</p></li> <li><label>我也是L妹纸哦</label></li> <li><p>P先生就是我哦</p></li> </ol> <script type="text/javascript"> $("li:has('label')").css("background-color", "blue"); </script>

--:hidden过滤选择器

:hidden过滤选择器的功能是获取全部不可见的元素,这些不可见的元素中包括type属性值为hidden的元素。

<h3>显示隐藏元素的内容</h3> <input id="hidstr" type="hidden" value="我已隐藏起来"/> <div></div> <script type="text/javascript"> var $strHTML = $("input:hidden").val(); $("div").html($strHTML); </script>

--:visible过滤选择器

与上一节的:hidden过滤选择器相反,:visible过滤选择器获取的是全部可见的元素,也就是说,只要不将元素的display属性值设置为“none”,那么,都可以通过该选择器获取。

<h3>修改可见“水果”的背景色</h3> <ul> <li style="display:none">橘子</li> <li style="display:block">香蕉</li> <li style="display:">葡萄</li> <li>苹果</li> <li style="display:none">西瓜</li> </ul> <script type="text/javascript"> $("li:visible").css("background-color","blue"); </script>

--

以上内容就是关于周六总结正则表达式(完整篇)的全部内容,希望大家喜欢。

时间: 2024-09-17 04:55:42

周末总结正则表达式(完整篇)的相关文章

JavaScript正则表达式(总结篇)

本文是小编参考其他有关js正则表达式资料整理的,主要目的有两个:一:自我复习归纳总结.二:共享方便大家搜索 .js正则表达式感兴趣的朋友可以一起学习,没有写的知识点,欢迎大家补充,共同学习进步. 验证数字:^[0-9]*$ 验证n位的数字:^\d{n}$ 验证至少n位数字:^\d{n,}$ 验证m-n位的数字:^\d{m,n}$ 验证零和非零开头的数字:^(0|[1-9][0-9]*)$ 验证有两位小数的正实数:^[0-9]+(.[0-9]{2})?$ 验证有1-3位小数的正实数:^[0-9]+

正则表达式小结篇

正则表达式就是由普通字符(例如字符 a 到 z)以及特殊字符(称为元字符)组成的文字模式.该模式描述在查找文字主体时待匹配的一个或多个字符串.正则表达式作为一个模板,将某个字符模式与所搜索的字符串进行匹配. 下面小编给大家总结了些关于正则表达式知识点,具体内容如下所示: 1.元字符 [拥有特殊含义的元字符]   \d -> 匹配一个0-9的数字,相当于[0-9],和它相反的是\D ->匹配一个除了0-9的任意字符   \w -> 匹配一个0-9.a-z.A-Z._的数字或字符,相当于[0

伪静态技术介绍与优缺点分析(较完整篇)_其它综合

1.静态网页与动态比较: 1)静态网页: 优势:A. 对搜索引擎友好,被收录的质量高:B.访问速度快:C.资源(cpu 等)占用少. 劣势:A.对于大型门户,或者社区来说,不断的修改将会产生大量I/O,会导致磁盘出现碎片甚至出现磁盘坏道.相当恐怖一个隐患.用户信息一旦没有了就没戏玩了.B.储存空间占用会多一些. 2)动态网页: 优势:相对于静态,它的劣势也就是动态的优势所在--占用空间少,对硬盘友好. 劣势:A.对搜索引擎不友好.搜索引擎会不收录带问号的网址?因为搜索引擎怕由于问号而进入死循环.

关于正则表达式第一篇

正则表达式在编程语言中,数据库中,linux中都有着广泛的应用,一说起正则表达式就有些高深晦涩的味道,正则表达式精炼而重要,在Linux中有着举足轻重的作用,也是学好sed,awk的一个基本门槛. 正则表达式是基于正则表达式引擎来实现的,引擎主要有以下两类.可能大家对这个比较陌生. POSIX基本正则表达式引擎  BRE POSIX扩展正则表达式引擎  ERE 大多数的Linux实现中都是BRE,也是默认的实现,还有扩展的实现就是ERE. 像grep,awk就支持基本和扩展的引擎,sed只支持基

关于正则表达式第二篇

在第一篇中介绍了关于纯文本和特殊字符在正则表达式中的应用,来看看其它的一些相关的点.--关于锚定 锚定就跟大家在开发网页的时候使用的锚定是一个意思,其实就是给一段字符做个标识.对于行首使用是^,对于行尾使用时$,可能大家并不陌生. 锁定在行首 $ echo "The book store" |sed -n '/^book/p'     --这个命令没有输出,是因为锚定不在行首. $ echo "Books are great"|sed -n '/^Book/p'  

javascript正则表达式基础篇_正则表达式

正则表达式:语法:/expression/,斜杠表示起始位置 创建方式:     1.var regObj = new RegExp("pattern",[,"flags"]);        pattern:必选项,正则表达式的字符串:        flags:可选项,一些标志组合.    2.var regObj = /pattern/[flags];该方式不能用引号将pattern和flags括起来. 正则表示对象RegExp对象的方法:     exec:

常用正则表达式 整理篇_正则表达式

匹配中文字符的正则表达式: [\u4e00-\u9fa5] 匹配双字节字符(包括汉字在内): [^\x00-\xff] 应用:计算字符串的长度(一个双字节字符长度计2,ASCII字符计1) String.prototype.len=function(){ return this.replace([^\x00-\xff]/g,"aa").length; } 匹配空行的正则表达式: \n[\s|]*\r 匹配HTML标记的正则表达式: /<(.*)>.*<\/\1>

jQuery最佳实践完整篇_jquery

上周,我整理了<jQuery设计思想>. 那篇文章是一篇入门教程,从设计思想的角度,讲解"怎么使用jQuery".今天的文章则是更进一步,讲解"如何用好jQuery". 我主要参考了Addy Osmani的PPT<提高jQuery性能的诀窍>(jQuery Proven Performance Tips And Tricks).他是jQuery开发团队的成员,具有一定的权威性,提出的结论都有测试数据支持,非常有价值. ============

正则表达式(语法篇推荐)_基础知识

正则表达式的构造摘要 构造 匹配  字符 x 字符 x \\ 反斜线字符 \0n 带有八进制值 0 的字符 n (0 <= n <= 7) \0nn 带有八进制值 0 的字符 nn (0 <= n <= 7) \0mnn 带有八进制值 0 的字符 mnn(0 <= m <= 3.0 <= n <= 7) \xhh 带有十六进制值 0x 的字符 hh \uhhhh 带有十六进制值 0x 的字符 hhhh \t 制表符 ('\u0009') \n 新行(换行)符