正则表达式(regular expression)描述了一种字符串匹配的模式(pattern) 。
正则表达式具体规则请参看"05-正则表达式系统教程.CHM"。
常用正则表达式:
匹配身份证号码:/^\d{15}$|^\d{18}$/ 或 /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
邮箱:/^\w+@\w+\.[a-zA-Z]{2,3}(\.[a-zA-Z]{2,3})?$/
中国的邮政编码:/^\d{6}$/
匹配字符串中的中文字符:/[\u4e00-\u9fa5]/
验证5到12位的qq号:/^\d{5,12}$/
手机号码:/^(13|15|18)\d{9}$/
生日:/^((19\d{2})|(20\d{2}))-(0?[1-9]|1[0-2])-(0?[1-9]|[1-2]\d|3[0-1])$/
一、正则表达式test方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>正则表达式test方法</title>
</head>
<body style="text-align: center;">
<textarea id="txt" style=" width: 80%; height: 100px;"></textarea>
<br /><br />
<input type="button" value="测 试" onclick="myTest();">
</body>
</html>
<script type="text/javascript">
function myTest()
{
//定义正则表达式两种方式
//var strExp = new RegExp("hello","i"); //i:忽略大小写,g:全局匹配 ,m:多行匹配
//var strExp = /hello/i; //i:忽略大小写,g:全局匹配 ,m:多行匹配
//test方法:匹配成功返回true,匹配失败返回false
//test方法判断一个敏感字符串(fuck)
// var str = document.getElementById("txt").value;
// var regExp = /fuck/i;
// if(regExp.test(str))
// {
// alert('不要说脏话!');
// return;
// }
// alert('提交成功!');
//test方法判断多个敏感字符(fuck,垃圾)
// var str = document.getElementById("txt").value;
// var regExp = /fuck|垃圾/i;
// if(regExp.test(str))
// {
// alert('不要说脏话!');
// return;
// }
// alert('提交成功');
//test方法判断内容只能是男或去
// var str = document.getElementById("txt").value;
// //var regExp = /男|女/; //此时输入"不男不女"也可以成功通过,需改良如下
// var regExp = /^男$|^女$/;
// if(!regExp.test(str))
// {
// alert('性别必须是男或女!');
// return;
// }
// alert('提交成功');
//test方法判断QQ号的合法性(QQ号码必须是5-12位的数字)
// var str = document.getElementById("txt").value;
// var regExp = /^\d{5,12}$/;
// if(!regExp.test(str))
// {
// alert('QQ号码格式错误!');
// return;
// }
// alert('提交成功');
//多行匹配:当正则中含有^和$的时候,在文本框中任意一行符合格式要求,都可以通过
//test方法判断QQ号的合法性(QQ号码必须是5-12位的数字)
// var str = document.getElementById("txt").value;
// var regExp = /^\d{5,12}$/m;
// if(!regExp.test(str))
// {
// alert('QQ号码格式错误!');
// return;
// }
// alert('提交成功');
//备注:test方法使用过程中全局匹配g是没有意义的
}
</script>
二、正则表达式exec方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>正则表达式exec方法</title>
</head>
<body style="text-align: center;">
<textarea id="txt" style=" width: 80%; height: 100px;"></textarea>
<br /><br />
<input type="button" value="测 试" onclick="myTest();">
</body>
</html>
<script type="text/javascript">
function myTest()
{
//exec方法:exec方法匹配之后返回值非常复杂,有兴趣可以查阅相关文档。
//但是我们记住主要的:
//(1)直接通过返回值可以得到匹配成功的字符串
//(2)返回值index属性可以得到匹配成功的字符串位置
//(3)如果匹配不成功则返回null
//匹配暧昧字符串
// var str = document.getElementById("txt").value;
// var strExp = /love|kiss|miss/i; //i:忽略大小写,g:全局匹配 ,m:多行匹配
// var result = strExp.exec(str);
// if(result != null)
// {
// alert("恶心,在位置" + result.index + "处"+result+"词语恶心到我了!");
// return;
// }
// alert("提交成功!");
//匹配暧昧字符串(全局匹配)
//exec方法中使用全局匹配是指可以通过反复调用 exec() 方法来遍历字符串中的所有匹配文本
var str = document.getElementById("txt").value;
//var strExp = new RegExp("Fuck","g"); //i:忽略大小写,g:全局匹配 ,m:多行匹配
var strExp = /love|kiss|miss/ig; //i:忽略大小写,g:全局匹配 ,m:多行匹配
var result;
var count = 0;
while((result = strExp.exec(str)) != null)
{
alert("不要挑逗我,在位置" + result.index + "处"+result+"词语恶心到我了!");
count++;
}
if(count == 0)
alert("提交成功!");
else
alert("你一共挑逗了我" + count + "次");
}
</script>
三、String对象的match方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>String对象的match方法</title>
</head>
<body style="text-align: center;">
<textarea id="txt" style=" width: 80%; height: 100px;"></textarea>
<br /><br />
<input type="button" value="测 试" onclick="myTest();">
</body>
</html>
<script type="text/javascript">
function myTest()
{
//match方法:
//(1)匹配成功返回匹配成功的字符串
//(2)匹配不成功返回null
//(3)全局模式下匹配成功直接返回匹配成功的字符串数组
//匹配暧昧字符串
var str = document.getElementById("txt").value;
//var strExp = /love|kiss|miss/i; //match执行后返回第一处匹配成功的字符串或者null
var strExp = /love|kiss|miss/ig; //match执行后返回所有匹配成功的字符串数组或者null
var result = str.match(strExp);
if(result == null)
alert("提交成功!");
else
alert(result + " 你的这些话好恶心!")
}
</script>
四、String对象Search方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>String对象Search方法</title>
</head>
<body style="text-align: center;">
<textarea id="txt" style=" width: 80%; height: 100px;"></textarea>
<br /><br />
<input type="button" value="测 试" onclick="myTest();">
</body>
</html>
<script type="text/javascript">
function myTest()
{
//search方法:匹配成功返回字符串出现的位置,匹配不成功返回-1
//search方法不执行全局匹配,它将忽略标志 g
//匹配暧昧字符串
var str = document.getElementById("txt").value;
var strExp = /love|kiss|miss/i; //i:忽略大小写,g:全局匹配 ,m:多行匹配
var result = str.search(strExp);
if(result == -1)
alert("提交成功!");
else
alert("在位置" + result + "处恶心到我了!");
}
</script>
五、String对象replace方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>String对象replace方法</title>
</head>
<body style="text-align: center;">
<textarea id="txt" style=" width: 80%; height: 100px;"></textarea>
<br /><br />
<input type="button" value="测 试" onclick="myTest();">
</body>
</html>
<script type="text/javascript">
function myTest()
{
//replace方法:匹配成功对匹配到的字符串用指定字符串进行替换
//默认第一处匹配成功的字符串,全局匹配的时候替换所有匹配成功的字符串
//替换暧昧挑逗字符串
// var str = document.getElementById("txt").value;
// var strExp = /love|kiss|miss/ig; //i:忽略大小写,g:全局匹配 ,m:多行匹配
// var result = str.replace(strExp,"****");
// document.getElementById("txt").value = result;
//删除用户输入的空格和.
var str = document.getElementById("txt").value;
var strExp = /[\. ]/g; //i:忽略大小写,g:全局匹配 ,m:多行匹配
var result = str.replace(strExp,"");
document.getElementById("txt").value = result;
}
</script>
六、正则实现查找字符串高亮显示
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>查找字符串</title>
<style type="text/css">
#search{ height:30px; line-height:30px; text-align: center;}
#content{ line-height: 30px;}
.light{ background-color: yellow;}
</style>
</head>
<body>
<div id="search">
<input type="text" id="txtSearch" />
<input type="button" value="搜索" onclick="mySearch();" />
</div>
<div id="content">
Microsoft Office
Microsoft Office是微软公司开发的一套基于 Windows 操作系统的办公软件套装。常用组件有 Word、Excel、Powerpoint等。最新版本为Office 365(Office 16)。
2013年3月微软副总裁杰夫·特珀说微软将于今年上半年推出代号为“Oslo”的Office应用,该款应用将支持Windows8、以及搭载了苹果iOS和谷歌Android移动操作系统的智能手机和平板电脑。[1] 微软将于11月2日在纽约举办Office发布会。
信息概述
Microsoft Office是一套由微软公司开发的办公软件,它为 Microsoft Windows 和 Mac OS X而开发。与办公室应用程序一样,它包括联合的服务器和基于互联网的服务。最近版本的 Office 被称为 “Office system” 而不叫 “Office suite”,反映出它们也包括服务器的事实。
该软件最初出现于九十年代早期,最初是一个推广名称,指一些以前曾单独发售的软件的合集。当时主要的推广重点是购买合集比单独购买要省很多钱。最初的 Office 版本只有 Word、Excel 和 Powerpoint;另外一个专业版包含 Microsoft Access;随着时间的流逝,Office 应用程序逐渐整合,共享一些特性,例如拼写和语法检查、OLE 数据整合和微软 Microsoft VBA(Visual Basicfor Applications)脚本语言。
该软件被认为是一个开发文档的事实标准,而且有一些特性在其他产品中并不存在;但是其他产品也有 Office 缺少的特性。2007 Microsoft Office System 有一个和以前版本差异很大的用户界面。
Microsoft 使用早期的 Apple 雏形开发了Word 1.0,它于1984年发布在最初的 Mac 中。Multiplan 和 Chart 也在 512K Mac 下开发,最后它们于1985年合在一起作为Microsoft Excel 1.0 发布:第一个在 Mac 上使用的轰动一时的零售程序。
因此,早期的 Microsoft Office 程序根源于Mac,当然,也反映在用户界面上。作为Mac的第一个和最大的软件提供者,在最初的 Macintosh 上做的一些 UI 决定受 Microsoft 开发团队的要求影响。当然,Office 图形化用户界面(特别是顶级菜单条)的最基本的轮廓有它在第一个 Macintosh 版本中的根源。
微软产品经理派特·波贝特2012年10月17日证实,微软计划推出iOS和 Android 版 Office 应用。对此,微软公关部门已给予证实:“除了Windows,Office 也将面向其他操作系统发布,包括 Windows Phone、Windows、Mac、Android、iOS 和塞班。”这意味着,众多平板电脑的用户将可以更方便地使用 Office 来进行办公。
据了解,Office 2013 将于 2012 年底面向企业用户发布,2013年2月底面向个人用户推出。此前曾有报道称,微软 2012年11月将推出 iPad 版Office。业内人士称,如今看来,微软希望在新版 Office 发布后,再推出 iOS 和 Android 版 Office。
好消息是,Office 365 订阅用户不仅有权在五台 Windows/Mac 计算机上安装Office,还能够在 Windows Phone 或是 Surface 平板电脑上安装Office,而 iOS 和 Android 版 Office 不计算在内。也就是说,订阅一份Office 365,可以在10+台机器上安装。
常用组件
Microsoft office Word
Microsoft Office Word 是文字处理软件。它被认为是 Office 的主要程序。它在文字处理软件市场上拥有统治份额。它私有的 DOC 格式被尊为一个行业的标准,虽然它的新版本 Word 2007 也支持一个基于XML的格式。Word 也适宜某些版本的 Microsoft Works。它适宜 Windows 和 Mac 平台。它的主要竞争者是 Writer、Star Office、Corel WordPerfect 和 Apple Pages。
Microsoft Office Excel
Microsoft Office Excel 是电子数据表程序〔进行数字和预算运算的软件程序〕。是最早的office组件。Excel内置了多种函数,可以对大量数据进行分类、排序甚至绘制图表等。像 Microsoft office Word,它在市场拥有统治份额。它最初对占优势的 Lotus1-2-3 是个竞争者,但最后它卖得比它多、快,于是它成为了实际标准。它适宜 Windows 和 Mac 平台。它的主要竞争者是 Calc、Star Office 和 Corel Quattro Pro。
Microsoft Office PowerPoint
Microsoft Office PowerPoint,是微软公司设计的演示文稿软件。用户不仅可以在投影仪或者计算机上进行演示,也可以将演示文稿打印出来,制作成胶片,以便应用到更广泛的领域中。利用 Powerpoint 不仅可以创建演示文稿,还可以在互联网上召开面对面会议、远程会议或在网上给观众展示演示文稿。 Powerpoint 做出来的东西叫演示文稿,它是一个文件,其格式后缀名为:. ppt,或者也可以保存为.pdf、图片格式等,2010和2013版本中可保存为视频格式。演示文稿中的每一页就叫幻灯片,每张幻灯片都是演示文稿中既相互独立又相互联系的内容。
</div>
</body>
</html>
<script type="text/javascript">
var strText = document.getElementById("content").innerHTML; //保存原始内容
function mySearch(){
document.getElementById("content").innerHTML = strText; //还原网页内容
var objKey = document.getElementById("txtSearch");
var objContent = document.getElementById("content");
var strExp = new RegExp(objKey.value,"gi");
objContent.innerHTML = objContent.innerHTML.replace(strExp,"<span class='light'>"+objKey.value+"</span>");
}
</script>
七、正则表达式验证表单
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>正则表达式验证表单</title>
<style type="text/css">
.errInfo{color: red; font-size: 12px;}
.errInfo img{ vertical-align:middle;}
</style>
<script type="text/javascript">
//检查用户名
function CheckAccount()
{
var acc = document.getElementById("txtAccount").value;
var objSpan = document.getElementById("spanAccount");
var exp = /^[a-zA-Z][a-zA-Z0-9]{3,15}$/;
if(exp.test(acc))
{
objSpan.innerHTML = "<img src='img/li_ok.gif'>";
return true;
}
else
{
objSpan.innerHTML = "<img src='img/li_err.gif'> 由英文字母和数字组成的4-16位字符,以字母开头!";
return false;
}
}
//检查昵称
function CheckNickName()
{
var nickName = document.getElementById("txtNickName").value;
var objSpan = document.getElementById("spanNickName");
var exp = /^[\u4e00-\u9fa5]{2,6}$/;
if(exp.test(nickName))
{
objSpan.innerHTML = "<img src='img/li_ok.gif'>";
return true;
}
else
{
objSpan.innerHTML = "<img src='img/li_err.gif'> 由2-8个汉字组成!";
return false;
}
}
//检查身份证
function CheckIDCard()
{
var idCard = document.getElementById("txtIDCard").value;
var objSpan = document.getElementById("spanIDCard");
var exp = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
if(exp.test(idCard))
{
objSpan.innerHTML = "<img src='img/li_ok.gif'>";
return true;
}
else
{
objSpan.innerHTML = "<img src='img/li_err.gif'> 由15位或18位数字组成,最后一位可以是X!";
return false;
}
}
//检查邮箱
function CheckMail()
{
var mail = document.getElementById("txtMail").value;
var objSpan = document.getElementById("spanMail");
var exp = /^\w+@\w+\.[a-zA-Z]{2,3}(\.[a-zA-Z]{2,3})?$/;
if(exp.test(mail))
{
objSpan.innerHTML = "<img src='img/li_ok.gif'>";
return true;
}
else
{
objSpan.innerHTML = "<img src='img/li_err.gif'> 邮箱账号@域名 如:good@qq.com!";
return false;
}
}
//检查密码
function CheckPwd()
{
//密码验证
var pwd = document.getElementById("txtPwd").value;
var objSpan = document.getElementById("spanPwd");
var exp = /^[a-zA-Z0-9]{4,10}$/;
if(exp.test(pwd))
{
objSpan.innerHTML = "<img src='img/li_ok.gif'>";
return true;
}
else
{
objSpan.innerHTML = "<img src='img/li_err.gif'> 由英文字母和数字组成4-10位字符!";
return false;
}
}
//检查密码确认
function CheckPwdOk()
{
var pwd = document.getElementById("txtPwd").value;
var pwdOk = document.getElementById("txtPwdOk").value;
var objSpan = document.getElementById("spanPwdOk");
if(pwdOk.length == 0)
{
objSpan.innerHTML = "<img src='img/li_err.gif'> 密码确认不能为空!";
return false;
}
else if(pwd != pwdOk)
{
objSpan.innerHTML = "<img src='img/li_err.gif'> 两次输入密码不一致!";
return false;
}
else
{
objSpan.innerHTML = "<img src='img/li_ok.gif'>";
return true;
}
}
//检查手机号码
function CheckPhone()
{
var phone = document.getElementById("txtPhone").value;
var objSpan = document.getElementById("spanPhone");
var exp = /^(13|15|18)\d{9}$/;
if(exp.test(phone))
{
objSpan.innerHTML = "<img src='img/li_ok.gif'>";
return true;
}
else
{
objSpan.innerHTML = "<img src='img/li_err.gif'> 由11位数字组成,以13,15,18开头!";
return false;
}
}
//检查生日
function CheckBirth()
{
var birth = document.getElementById("txtBirth").value;
var objSpan = document.getElementById("spanBirth");
var exp = /^(19\d{2})|(200\d{1})-(0?[1-9]|1[0-2])-(0?[1-9]|[1-2]\d|3[0-1])$/;
if(exp.test(birth))
{
objSpan.innerHTML = "<img src='img/li_ok.gif'>";
return true;
}
else
{
objSpan.innerHTML = "<img src='img/li_err.gif'> 日期在1900-2009之间,如:1985-8-9!";
return false;
}
}
//注册表单提交
function reg()
{
if(CheckAccount() & CheckNickName() & CheckIDCard() & CheckMail()
& CheckPwd() & CheckPwdOk() & CheckPhone() & CheckBirth())
return true;
else
return false;
}
</script>
</head>
<body>
<form action="Demo07_01.html" onsubmit="return reg();">
<table width="1000" align="center">
<caption>用户注册</caption>
<tr>
<td width="300" align="right" height="30">用户名:</td>
<td width="700"><input type="text" id="txtAccount" onblur="CheckAccount();">
<span id="spanAccount" class="errInfo">由英文字母和数字组成的4-16位字符,以字母开头</span>
</td>
</tr>
<tr>
<td width="300" align="right" height="30">昵称:</td>
<td width="700"><input type="text" id="txtNickName" onblur="CheckNickName();">
<span id="spanNickName" class="errInfo">由2-8个汉字组成</span>
</td>
</tr>
<tr>
<td width="300" align="right" height="30">身份证号:</td>
<td width="700"><input type="text" id="txtIDCard" onblur="CheckIDCard();">
<span id="spanIDCard" class="errInfo">由15位或18位数字组成,最后一位可以是X</span>
</td>
</tr>
<tr>
<td width="300" align="right" height="30">邮箱:</td>
<td width="700"><input type="text" id="txtMail" onblur="CheckMail();">
<span id="spanMail" class="errInfo">邮箱账号@域名 如:good@qq.com</span>
</td>
</tr>
<tr>
<td width="300" align="right" height="30">密码:</td>
<td width="700"><input type="password" id="txtPwd" onblur="CheckPwd();">
<span id="spanPwd" class="errInfo">由英文字母和数字组成4-10位字符</span>
</td>
</tr>
<tr>
<td width="300" align="right" height="30">密码确认:</td>
<td width="700"><input type="password" id="txtPwdOk" onblur="CheckPwdOk();">
<span id="spanPwdOk" class="errInfo"></span>
</td>
</tr>
<tr>
<td width="300" align="right" height="30">手机号码:</td>
<td width="700"><input type="text" id="txtPhone" onblur="CheckPhone();">
<span id="spanPhone" class="errInfo">由11位数字组成,以13,15,18开头</span>
</td>
</tr>
<tr>
<td width="300" align="right" height="30">出生日期:</td>
<td width="700"><input type="text" id="txtBirth" onblur="CheckBirth();">
<span id="spanBirth" class="errInfo">日期在1900-2009之间,如:1985-8-9</span>
</td>
</tr>
<tr>
<td width="300" align="right" height="30"> </td>
<td width="700">
<input type="submit" value="注册" />
<input type="reset" value="取消" />
</td>
</tr>
</table>
</form>
</body>
</html>