正則表達(dá)式(regular expression)描述了一種字符串匹配的模式(pattern) 。
正則表達(dá)式具體規(guī)則請(qǐng)參看"05-正則表達(dá)式系統(tǒng)教程.CHM"。
常用正則表達(dá)式:
匹配身份證號(hào)碼:/^\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})?$/
中國(guó)的郵政編碼:/^\d{6}$/
匹配字符串中的中文字符:/[\u4e00-\u9fa5]/
驗(yàn)證5到12位的qq號(hào):/^\d{5,12}$/
手機(jī)號(hào)碼:/^(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])$/
一、正則表達(dá)式test方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>正則表達(dá)式test方法</title>
</head>
<body style="text-align: center;">
<textarea id="txt" style=" width: 80%; height: 100px;"></textarea>
<br /><br />
<input type="button" value="測(cè) 試" onclick="myTest();">
</body>
</html>
<script type="text/javascript">
function myTest()
{
//定義正則表達(dá)式兩種方式
//var strExp = new RegExp("hello","i"); //i:忽略大小寫,g:全局匹配 ,m:多行匹配
//var strExp = /hello/i; //i:忽略大小寫,g:全局匹配 ,m:多行匹配
//test方法:匹配成功返回true,匹配失敗返回false
//test方法判斷一個(gè)敏感字符串(fuck)
// var str = document.getElementById("txt").value;
// var regExp = /fuck/i;
// if(regExp.test(str))
// {
// alert('不要說臟話!');
// return;
// }
// alert('提交成功!');
//test方法判斷多個(gè)敏感字符(fuck,垃圾)
// var str = document.getElementById("txt").value;
// var regExp = /fuck|垃圾/i;
// if(regExp.test(str))
// {
// alert('不要說臟話!');
// return;
// }
// alert('提交成功');
//test方法判斷內(nèi)容只能是男或去
// var str = document.getElementById("txt").value;
// //var regExp = /男|女/; //此時(shí)輸入"不男不女"也可以成功通過,需改良如下
// var regExp = /^男$|^女$/;
// if(!regExp.test(str))
// {
// alert('性別必須是男或女!');
// return;
// }
// alert('提交成功');
//test方法判斷QQ號(hào)的合法性(QQ號(hào)碼必須是5-12位的數(shù)字)
// var str = document.getElementById("txt").value;
// var regExp = /^\d{5,12}$/;
// if(!regExp.test(str))
// {
// alert('QQ號(hào)碼格式錯(cuò)誤!');
// return;
// }
// alert('提交成功');
//多行匹配:當(dāng)正則中含有^和$的時(shí)候,在文本框中任意一行符合格式要求,都可以通過
//test方法判斷QQ號(hào)的合法性(QQ號(hào)碼必須是5-12位的數(shù)字)
// var str = document.getElementById("txt").value;
// var regExp = /^\d{5,12}$/m;
// if(!regExp.test(str))
// {
// alert('QQ號(hào)碼格式錯(cuò)誤!');
// return;
// }
// alert('提交成功');
//備注:test方法使用過程中全局匹配g是沒有意義的
}
</script>
二、正則表達(dá)式exec方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>正則表達(dá)式exec方法</title>
</head>
<body style="text-align: center;">
<textarea id="txt" style=" width: 80%; height: 100px;"></textarea>
<br /><br />
<input type="button" value="測(cè) 試" onclick="myTest();">
</body>
</html>
<script type="text/javascript">
function myTest()
{
//exec方法:exec方法匹配之后返回值非常復(fù)雜,有興趣可以查閱相關(guān)文檔。
//但是我們記住主要的:
//(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方法中使用全局匹配是指可以通過反復(fù)調(diào)用 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對(duì)象的match方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>String對(duì)象的match方法</title>
</head>
<body style="text-align: center;">
<textarea id="txt" style=" width: 80%; height: 100px;"></textarea>
<br /><br />
<input type="button" value="測(cè) 試" onclick="myTest();">
</body>
</html>
<script type="text/javascript">
function myTest()
{
//match方法:
//(1)匹配成功返回匹配成功的字符串
//(2)匹配不成功返回null
//(3)全局模式下匹配成功直接返回匹配成功的字符串?dāng)?shù)組
//匹配曖昧字符串
var str = document.getElementById("txt").value;
//var strExp = /love|kiss|miss/i; //match執(zhí)行后返回第一處匹配成功的字符串或者null
var strExp = /love|kiss|miss/ig; //match執(zhí)行后返回所有匹配成功的字符串?dāng)?shù)組或者null
var result = str.match(strExp);
if(result == null)
alert("提交成功!");
else
alert(result + " 你的這些話好惡心!")
}
</script>
四、String對(duì)象Search方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>String對(duì)象Search方法</title>
</head>
<body style="text-align: center;">
<textarea id="txt" style=" width: 80%; height: 100px;"></textarea>
<br /><br />
<input type="button" value="測(cè) 試" onclick="myTest();">
</body>
</html>
<script type="text/javascript">
function myTest()
{
//search方法:匹配成功返回字符串出現(xiàn)的位置,匹配不成功返回-1
//search方法不執(zhí)行全局匹配,它將忽略標(biāo)志 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對(duì)象replace方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>String對(duì)象replace方法</title>
</head>
<body style="text-align: center;">
<textarea id="txt" style=" width: 80%; height: 100px;"></textarea>
<br /><br />
<input type="button" value="測(cè) 試" onclick="myTest();">
</body>
</html>
<script type="text/javascript">
function myTest()
{
//replace方法:匹配成功對(duì)匹配到的字符串用指定字符串進(jìn)行替換
//默認(rèn)第一處匹配成功的字符串,全局匹配的時(shí)候替換所有匹配成功的字符串
//替換曖昧挑逗字符串
// 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>
六、正則實(shí)現(xiàn)查找字符串高亮顯示
<!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是微軟公司開發(fā)的一套基于 Windows 操作系統(tǒng)的辦公軟件套裝。常用組件有 Word、Excel、Powerpoint等。最新版本為Office 365(Office 16)。
2013年3月微軟副總裁杰夫·特珀說微軟將于今年上半年推出代號(hào)為“Oslo”的Office應(yīng)用,該款應(yīng)用將支持Windows8、以及搭載了蘋果iOS和谷歌Android移動(dòng)操作系統(tǒng)的智能手機(jī)和平板電腦。[1] 微軟將于11月2日在紐約舉辦Office發(fā)布會(huì)。
信息概述
Microsoft Office是一套由微軟公司開發(fā)的辦公軟件,它為 Microsoft Windows 和 Mac OS X而開發(fā)。與辦公室應(yīng)用程序一樣,它包括聯(lián)合的服務(wù)器和基于互聯(lián)網(wǎng)的服務(wù)。最近版本的 Office 被稱為 “Office system” 而不叫 “Office suite”,反映出它們也包括服務(wù)器的事實(shí)。
該軟件最初出現(xiàn)于九十年代早期,最初是一個(gè)推廣名稱,指一些以前曾單獨(dú)發(fā)售的軟件的合集。當(dāng)時(shí)主要的推廣重點(diǎn)是購(gòu)買合集比單獨(dú)購(gòu)買要省很多錢。最初的 Office 版本只有 Word、Excel 和 Powerpoint;另外一個(gè)專業(yè)版包含 Microsoft Access;隨著時(shí)間的流逝,Office 應(yīng)用程序逐漸整合,共享一些特性,例如拼寫和語法檢查、OLE 數(shù)據(jù)整合和微軟 Microsoft VBA(Visual Basicfor Applications)腳本語言。
該軟件被認(rèn)為是一個(gè)開發(fā)文檔的事實(shí)標(biāo)準(zhǔn),而且有一些特性在其他產(chǎn)品中并不存在;但是其他產(chǎn)品也有 Office 缺少的特性。2007 Microsoft Office System 有一個(gè)和以前版本差異很大的用戶界面。
Microsoft 使用早期的 Apple 雛形開發(fā)了Word 1.0,它于1984年發(fā)布在最初的 Mac 中。Multiplan 和 Chart 也在 512K Mac 下開發(fā),最后它們于1985年合在一起作為Microsoft Excel 1.0 發(fā)布:第一個(gè)在 Mac 上使用的轟動(dòng)一時(shí)的零售程序。
因此,早期的 Microsoft Office 程序根源于Mac,當(dāng)然,也反映在用戶界面上。作為Mac的第一個(gè)和最大的軟件提供者,在最初的 Macintosh 上做的一些 UI 決定受 Microsoft 開發(fā)團(tuán)隊(duì)的要求影響。當(dāng)然,Office 圖形化用戶界面(特別是頂級(jí)菜單條)的最基本的輪廓有它在第一個(gè) Macintosh 版本中的根源。
微軟產(chǎn)品經(jīng)理派特·波貝特2012年10月17日證實(shí),微軟計(jì)劃推出iOS和 Android 版 Office 應(yīng)用。對(duì)此,微軟公關(guān)部門已給予證實(shí):“除了Windows,Office 也將面向其他操作系統(tǒng)發(fā)布,包括 Windows Phone、Windows、Mac、Android、iOS 和塞班。”這意味著,眾多平板電腦的用戶將可以更方便地使用 Office 來進(jìn)行辦公。
據(jù)了解,Office 2013 將于 2012 年底面向企業(yè)用戶發(fā)布,2013年2月底面向個(gè)人用戶推出。此前曾有報(bào)道稱,微軟 2012年11月將推出 iPad 版Office。業(yè)內(nèi)人士稱,如今看來,微軟希望在新版 Office 發(fā)布后,再推出 iOS 和 Android 版 Office。
好消息是,Office 365 訂閱用戶不僅有權(quán)在五臺(tái) Windows/Mac 計(jì)算機(jī)上安裝Office,還能夠在 Windows Phone 或是 Surface 平板電腦上安裝Office,而 iOS 和 Android 版 Office 不計(jì)算在內(nèi)。也就是說,訂閱一份Office 365,可以在10+臺(tái)機(jī)器上安裝。
常用組件
Microsoft office Word
Microsoft Office Word 是文字處理軟件。它被認(rèn)為是 Office 的主要程序。它在文字處理軟件市場(chǎng)上擁有統(tǒng)治份額。它私有的 DOC 格式被尊為一個(gè)行業(yè)的標(biāo)準(zhǔn),雖然它的新版本 Word 2007 也支持一個(gè)基于XML的格式。Word 也適宜某些版本的 Microsoft Works。它適宜 Windows 和 Mac 平臺(tái)。它的主要競(jìng)爭(zhēng)者是 Writer、Star Office、Corel WordPerfect 和 Apple Pages。
Microsoft Office Excel
Microsoft Office Excel 是電子數(shù)據(jù)表程序〔進(jìn)行數(shù)字和預(yù)算運(yùn)算的軟件程序〕。是最早的office組件。Excel內(nèi)置了多種函數(shù),可以對(duì)大量數(shù)據(jù)進(jìn)行分類、排序甚至繪制圖表等。像 Microsoft office Word,它在市場(chǎng)擁有統(tǒng)治份額。它最初對(duì)占優(yōu)勢(shì)的 Lotus1-2-3 是個(gè)競(jìng)爭(zhēng)者,但最后它賣得比它多、快,于是它成為了實(shí)際標(biāo)準(zhǔn)。它適宜 Windows 和 Mac 平臺(tái)。它的主要競(jìng)爭(zhēng)者是 Calc、Star Office 和 Corel Quattro Pro。
Microsoft Office PowerPoint
Microsoft Office PowerPoint,是微軟公司設(shè)計(jì)的演示文稿軟件。用戶不僅可以在投影儀或者計(jì)算機(jī)上進(jìn)行演示,也可以將演示文稿打印出來,制作成膠片,以便應(yīng)用到更廣泛的領(lǐng)域中。利用 Powerpoint 不僅可以創(chuàng)建演示文稿,還可以在互聯(lián)網(wǎng)上召開面對(duì)面會(huì)議、遠(yuǎn)程會(huì)議或在網(wǎng)上給觀眾展示演示文稿。 Powerpoint 做出來的東西叫演示文稿,它是一個(gè)文件,其格式后綴名為:. ppt,或者也可以保存為.pdf、圖片格式等,2010和2013版本中可保存為視頻格式。演示文稿中的每一頁(yè)就叫幻燈片,每張幻燈片都是演示文稿中既相互獨(dú)立又相互聯(lián)系的內(nèi)容。
</div>
</body>
</html>
<script type="text/javascript">
var strText = document.getElementById("content").innerHTML; //保存原始內(nèi)容
function mySearch(){
document.getElementById("content").innerHTML = strText; //還原網(wǎng)頁(yè)內(nèi)容
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>
七、正則表達(dá)式驗(yàn)證表單
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>正則表達(dá)式驗(yàn)證表單</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'> 由英文字母和數(shù)字組成的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個(gè)漢字組成!";
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位數(shù)字組成,最后一位可以是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'> 郵箱賬號(hào)@域名 如:good@qq.com!";
return false;
}
}
//檢查密碼
function CheckPwd()
{
//密碼驗(yàn)證
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'> 由英文字母和數(shù)字組成4-10位字符!";
return false;
}
}
//檢查密碼確認(rèn)
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'> 密碼確認(rèn)不能為空!";
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;
}
}
//檢查手機(jī)號(hào)碼
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位數(shù)字組成,以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;
}
}
//注冊(cè)表單提交
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>用戶注冊(cè)</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">由英文字母和數(shù)字組成的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個(gè)漢字組成</span>
</td>
</tr>
<tr>
<td width="300" align="right" height="30">身份證號(hào):</td>
<td width="700"><input type="text" id="txtIDCard" onblur="CheckIDCard();">
<span id="spanIDCard" class="errInfo">由15位或18位數(shù)字組成,最后一位可以是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">郵箱賬號(hào)@域名 如: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">由英文字母和數(shù)字組成4-10位字符</span>
</td>
</tr>
<tr>
<td width="300" align="right" height="30">密碼確認(rèn):</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">手機(jī)號(hào)碼:</td>
<td width="700"><input type="text" id="txtPhone" onblur="CheckPhone();">
<span id="spanPhone" class="errInfo">由11位數(shù)字組成,以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="注冊(cè)" />
<input type="reset" value="取消" />
</td>
</tr>
</table>
</form>
</body>
</html>