BlogJava-用手做事，用心做事，用生命做事-随笔分类-javascript

showModalDialog解释

王永庆 — Mon, 04 Feb 2008 04:52:00 GMT

window.showModalDialog()方法用来创建一个显示HTML内容的模态对话框，由于是对话框，因此它并没有一般用window.open()打开的窗口的所有属性。
window.showModelessDialog()方法用来创建一个显示HTML内容的非模态对话框。

当我们用showModelessDialog()打开窗口时，不必用window.close()去关闭它，当以非模态方式［IE5］打开时，打开对话框的窗口仍可以进行其他的操作，即对话框不总是最上面的焦点，当打开它的窗口ＵＲＬ改变时，它自动关闭。而模态［ＩＥ４］方式的对话框始终有焦点（焦点不可移走，直到它关闭）。模态对话框和打开它的窗口相联系，因此我们打开另外的窗口时，他们的链接关系依然保存，并且隐藏在活动窗口的下面。

使用方法如下：
vReturnValue = window.showModalDialog(sURL [, vArguments] [, sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [, sFeatures])
参数说明：
sURL
必选参数，类型：字符串。用来指定对话框要显示的文档的URL。
vArguments
可选参数，类型：变体。用来向对话框传递参数。传递的参数类型不限，包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures
可选参数，类型：字符串。用来描述对话框的外观等信息，可以使用以下的一个或几个，用分号“;”隔开。
dialogHeight 对话框高度，不小于１００px，ＩＥ４中dialogHeight 和 dialogWidth 默认的单位是em，而ＩＥ５中是px，为方便其见，在定义modal方式的对话框时，用px做单位。
　　dialogWidth: 对话框宽度。
　　dialogLeft: 距离桌面左的距离。
　　dialogTop: 离桌面上的距离。
　　center: {yes | no |  | 0 }：窗口是否居中，默认yes，但仍可以指定高度和宽度。
　　help: {yes | no |  | 0 }：是否显示帮助按钮，默认yes。
　　resizable: {yes | no |  | 0 } ［ＩＥ５＋］：是否可被改变大小。默认no。
　　status: {yes | no |  | 0 } ［IE5+］：是否显示状态栏。默认为yes[ Modeless]或no[Modal]。
scroll:{ yes | no |  | 0 | on | off }：指明对话框是否显示滚动条。默认为yes。

还有几个属性是用在HTA中的，在一般的网页中一般不使用。
dialogHide:{ yes | no |  | 0 | on | off }：在打印或者打印预览时对话框是否隐藏。默认为no。
edge:{ sunken | raised }：指明对话框的边框样式。默认为raised。
unadorned:{ yes | no |  | 0 | on | off }：默认为no。

传入参数：
要想对话框传递参数，是通过vArguments来进行传递的。类型不限制，对于字符串类型，最大为4096个字符。也可以传递对象，例如：

test.htm
====================

test2.htm
====================

test3.htm
====================

可以通过window.returnValue向打开对话框的窗口返回信息，当然也可以是对象。例如：

test4.htm
===================

test5.htm
===================

王永庆 2008-02-04 12:52 发表评论

关于Iframe之间以及与父窗体的值传递 ----转csdn

王永庆 — Tue, 08 Jan 2008 07:49:00 GMT

自己实现过了的,javascript脚本关于Iframe之间以及与父窗体的值传递,事件调用问题;

在父页面访问Iframe子窗体的txtAddress控件
window.frames["ifrMapCompanyDetails"].document.all("txtAddress").value = '地址' ;

在Iframe子窗体1访问父页面的TextBox1控件 , 子窗体1把值赋给子窗体2的某个控件
string strValue = "从子窗体传递给父页面的值" ;
下面是在Page_Load事件里面调用的,当然可以写在javascript脚本里面
this.Response.Write("");
this.Response.Write("");

在Iframe子窗体1访问子窗体2的txtAddress控件子窗体1把值赋给子窗体2的某个控件
window.parent.frames["ifrMapCompanyDetails"].document.all("txtAddress").value = '地址' ;

父窗体提交两个Iframe子窗体
window.frames["ifrMapCompanyDetails"].Form1.submit();
window.frames["ifrMapProductInfoDetails"].Form1.submit();

Iframe子窗体调用父页面的javascript事件
window.parent.XXX()

//父页面调用当前页面中IFRAME子页面中的脚本childEvent
function invokechildEvent()
{ var frm = document.frames["ifrChild1"].childEvent(); }
或者调用当前页面中第一个IFRAME中的脚本childEvent
{ var frm = document.frames[0]; frm.childEvent(); }

//子页面调用父窗体的某个按钮的按钮事件
window.parent.Form1.btnParent.click()

父页面调用子窗体的某个按钮的按钮事件
window.frames['ifrChild1'].document.all.item("btnChild3").click();

王永庆 2008-01-08 15:49 发表评论

css去掉下划线

王永庆 — Sun, 16 Dec 2007 05:38:00 GMT

我们可以用CSS语法来控制超链接的形式、颜色变化。

　　下面我们做一个这样的链接：未被点击时超链接文字无下划线，显示为蓝色；当鼠标在链接上时有下划线，链接文字显示为红色；当点击链接后，链接无下划线，显示为绿色。

　　实现方法很简单，在源代码的和之间加上如下的CSS语法控制：

　　其中：
　　a:link 指正常的未被访问过的链接；
　　a:active 指正在点的链接；
　　a:hover 指鼠标在链接上；
　　a:visited 指已经访问过的链接；
　　text-decoration是文字修饰效果的意思；
　　none参数表示超链接文字不显示下划线；
　　underline参数表示超链接的文字有下划线

王永庆 2007-12-16 13:38 发表评论

AJAX基础：JavaScript中类的实现----转载JAVAEye

王永庆 — Fri, 14 Dec 2007 08:28:00 GMT

通过使用无类型对象的构造方法来指定prototype对象，从而实现类的成员定义：

以下是代码片段：

//定义一个类class1
function class1(){
　//构造函数
}
//通过指定prototype对象来实现类的成员定义
class1.prototype={
　someProperty:"sample",//声明属性
someMethod:function(){ //声明方法
　　//方法代码
　},
　…//其他属性和方法.
}

　　上面的代码用一种很清晰的方式定义了class1，构造函数直接用类名来实现，而成员使用无类型对象来定义，以列表的方式实现了所有属性和方法，并且可以在定义的同时初始化属性的值。这也更象传统意义面向对象语言中类的实现。只是构造函数和类的成员定义被分为了两个部分，这可看成JavaScript中定义类的一种固定模式，这样在使用时会更加容易理解。

　　注意：在一个类的成员之间互相引用，必须通过this指针来进行，例如在上面例子中的someMethod方法中，如果要使用属性someProperty，必须通过this.someProperty的形式，因为在JavaScript中每个属性和方法都是独立的，它们通过this指针联系在一个对象上。

王永庆 2007-12-14 16:28 发表评论

javascript经验小结

王永庆 — Wed, 12 Dec 2007 12:22:00 GMT

（1）、将弹出页面显示在页面中间

function openNewWindow(){
window.open("productoffer_attr_new.html","newwindow",'height=400,width=400,top='+(screen.availHeight-400)/2+',left='+(screen.availWidth-400)/2+',toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no');
}

（2）、window.open 用来打开新窗口
              window.location 用来替换当前页，也就是重新定位当前页
（3）、setTimeout("loadTreeData()",1000);
               表示在1000ms之后运行loadTreeData函数
（4）、select文本框取值
1、取得option中的值
var selvalue=document.forms.attr_type.options[document.forms.attr_type.selectedIndex].value
2、取得option中的name
var selvalue=document.forms.attr_type.options[document.forms.attr_type.selectedIndex].text
（5）、取得复选框的值
function   openUpdateWindow()
{
          var   a   =   document.getElementsByName("rows");
          var   s   =   [];
          for(var   i=0;   i           {
                  if(a[i].type=="checkbox"   &&   a[i].checked)
                  {
                          s[s.length]   =   a[i].value;
                  }
          }
          if(s.length>=2){alert("修改权限只能选择一条记录！");
}else{
window.open("pages/product/productoffer/productoffer_attr_new.jsp?offer_id="+s[0],"newwindow",'height=300,width=400,top='+(screen.availHeight-200)/2+',left='+(screen.availWidth-400)/2+',toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no');
}
}
（6）、取得多选框和单选框的值

（7）、打开open传递form表单
window.open("","hello",'height=250,width=600,top='+(screen.availHeight-250)/2+',left='+(screen.availWidth-600)/2+',toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no');
  document.forms.target="hello";
  document.forms.action="pages/product/productoffer/product_offer_bindNew.jsp";
  document.forms.submit();
    (8)、取得单选况的值

    (9)、js设置文本框为只读
    document.getElementById("rivetValue").readOnly=true;

王永庆 2007-12-12 20:22 发表评论

HTML中的【字型变化标签】与【文字颜色设定】

王永庆 — Mon, 26 Nov 2007 09:19:00 GMT

原始码	呈现结果
粗体	粗体
斜体	斜体
底线	底线
^上标	^上标
_下标	_下标
`打字机`	`打字机`
闪烁（ie没效果）	闪烁
强调	强调
加强	加强
`范例`	`范例`
`原始码`	`原始码`
`变数`	`变数`
定义	定义
引用	引用
所在地址	所在地址

原始码	呈现结果
红	红色的字喔！
橙	橙色的字喔！
黄	黄色的字喔！
绿	绿色的字喔！
蓝	蓝色的字喔！
靛	靛色的字喔！
紫	紫色的字喔！
黑	黑色的字喔！
灰	灰色的字喔！

王永庆 2007-11-26 17:19 发表评论

css学习笔记（一）

王永庆 — Mon, 26 Nov 2007 09:18:00 GMT

(1)字体属性:
      字体名称属性 (font-family) {font-family:Arial}可选项:caption，icon ，menu ，message-box，small-caption，status-bar
      字体大小属性 (font-size){font-size:16pt}最长用的就是pt,px
      字体风格属性(font-style){font-sytle:italic}可选项:normal, italic, oblique。normal是缺省值，italic, oblique都是斜体显示。
      字体浓淡属性(font-weight)这个属性常用值是normal和bold，normal是缺省值
      字体变量属性(font-variant)这个属性有两个值，normal和small-caps，normal是缺省值。small-caps表示小的大写字体。
      字体属性(font){font:italic normal bold 11pt arial}
      字体颜色(color)
      行高属性(line-height) normal (缺省值) length (长度，可以用绝对单位(cm, mm, in, pt,pc)或者相对单位 (em, ex, px)) percentage (百分比，相当于父对象高度的百分比)

(2)文本属性
      文本对齐属性(text-align)可选项有:left,right,center,justify
      文本修饰属性(text-decoration)这个属性主要设定文本划线的属性。有以下值：none (无，缺省值) underline (下划线) overline (上划线) line-through (当中划线)
      文本缩进属性(text-indent)这个属性设定文本首行缩进。其值有以下设定方法：length (长度，可以用绝对单位(cm, mm, in, pt, pc)或者相对单位 (em, ex, px)) percentage (百分比，相当于父对象宽度的百分比)
      字间距属性(letter-spacing)这个属性用来设定字符之间的距离。normal (缺省值) length (长度，可以用绝对单位(cm, mm, in, pt, pc)或者相对单位 (em, ex, px))

王永庆 2007-11-26 17:18 发表评论

常用的css样式

王永庆 — Mon, 26 Nov 2007 09:17:00 GMT

字体
font-family: 字体名称
如果在font-family后加上多种字体的名称，浏览器回按字体名称的顺序逐一在用户的计算机里寻找已经安装的字体，一旦遇到与要求的相匹配的字体，就按这种字体显示网页内容，并停止搜索；如果不匹配就继续搜索，直到找到为止，万一样式表里的所有字体都没有安装的话，浏览器就会用自己默认的字体来替代显示网页的内容。
注意：
·当指定多种字体时，用“，”分隔每种字体名称。
·当字体名称包含两个以上分开的单词时，用“”把该字体名称括起来。
·当样式规则外已经有“”时，用‘’代替“”。
字体大小
font-size: 字号参数
字号的取值范围：
·以Point为单位：点单位在所有的浏览器和操作平台上都适用
·以Em为单位：指字母要素的尺寸，和Point相同距离
·以Pixes为单位：像素可以使用于所有的操作平台，但可能会因为浏览者的屏幕分辨率不同，而造成显示上的效果差异
·以in（英寸）为单位
·以cm（厘米）为单位
·以mm（毫米）为单位
·以pc（打印机的字体大小）为单位
·以ex（x-height）为单位
·smaller：比当前文字的默认大小更小一号
·larger：比当前文字的默认大小更小大号
·使用比例关系
·xx-small
·x-small
·small
·medium
·large
·x-large
·xx-large
字体风格
字体风格只能控制各种斜体字的显示。
基本格式如下：
font-style: 斜体字的名称
字体粗细
字体粗细控制粗体字的显示，取值范围从数字100~900，浏览器默认的字体粗细为400。另外可以通过参数lighter和bolder使得字体在原有基础上显得更细或更粗些。
基本格式如下：
font-weight: 字体粗细
文字大小写
文字大小写使网页的设计者不用在输入文字时就完成文字的大小写，而可以在输入完毕后，再根据需要对局部的文字设置大小写。
基本格式如下：
text-transform: 参数
参数取值范围：
·uppercase：所有文字大写显示
·lowercase：所有文字小写显示
·capitalize：每个单词的头字母大写显示
·none：不继承母体的文字变形参数
注意：继承是指HTML的标识符对于包含自己的标识符的参数会继承下来。
文字修饰
文字修饰的主要用途是改变浏览器显示文字链接时的下划线。
基本格式如下：
text-decoration: 参数
参数取值范围：
·underline：为文字加下划线
·overline：为文字加上划线
·line-through：为文字加删除线
·blink：使文字闪烁
·none：不显示上述任何效果
单词间距
单词间距指的是英文每个单词之间的距离，不包括中文文字。
基本格式如下：
word-spacing: 间隔距离
间隔距离的取值：points、em、pixes、in、cm、mm、pc、ex、normal等。
字母间距
字母间距是指英文字母之间的距离，功能、用法，以及参数的设置和单词间距很相似。
基本格式如下：
letter-spacing: 字母间距
行距
行距是指上下两行基准线之间的垂直距离。一般地说，英文五线格练习本，从上往下数的第三条横线就是计算机所认为的该行的基准线。
基本格式如下：
line-height: 行间距离
行间距离取值：
·不带单位的数字：以1为基数，相当于比例关系的100%
·带长度单位的数字：以具体的单位为准
·比例关系
注意：如果文字字体很大，而行距相对较小的话，可能会发生上下两行文字互相重叠的现象。
文本水平对齐
文本水平对齐可以控制文本的水平对齐，而且并不仅仅指文字内容，也包括设置图片、影像资料的对齐方式。
基本格式如下：
text-align: 参数
参数的取值：
·left：左对齐
·right：右对齐
·center：居中对齐
·justify：相对左右对齐
但需要注意的是，text-alight是块级属性，只能用于< p>、< blockquqte>、< ul>、< h1>~< h6>等标识符里。
文本垂直对齐
文本的垂直对齐应当是相对于文本母体的位置而言的，不是指文本在网页里垂直对齐。比如说，表格的单元格里有一段文本，那么对这段文本设置垂直居中就是针对单元格来衡量的，也就是说，文本将在单元格的正中显示，而不是整个网页的正中。
基本格式如下：
vertical-align: 参数
参数取值：
·top：顶对齐
·bottom：底对齐
·text-top：相对文本顶对齐
·text-bottom：相对文本底对齐
·baseline：基准线对齐
·middle：中心对齐
·sub：以下标的形式显示
·super：以上标的形式显示
文本缩进
文本缩进可以使文本在相对默认值较窄的区域里显示，主要用于中文板式的首行缩进，或是为大段的引用文本和备注做成缩进的格式。
基本格式如下：
text-indent: 缩进距离
缩进距离取值：
·带长度单位的数字
·比例关系
但是需要注意的是，在使用比例关系的时候，有人会认为浏览器默认的比例是相对段落的宽度而言的，其实事实并非如此，整个浏览器的窗口才是浏览器所默认的参照物。
另外，text-indent是块级属性，只能用于< p>、< blockquqte>、< ul>、< h1>~< h6>等标识符里。
颜色属性
基本格式如下：
color: 参数
颜色参数取值范围：
·以RGB值表示
·以16进制（hex）的色彩值表示
·以默认颜色的英文名称表示
以默认颜色的英文名称表示无疑是最为方便的，但由于预定义的颜色种类太少，所以更多的网页设计者喜欢用RGB的方式。RGB方式的好处很多，不但可以用数字的形式精确地表示颜色，而且也是很多图像制作软件（如Photoshop）里默认使用的规范，这样一来就为图片和网页更好地结合打下了坚实的基础。
背景颜色
在HTML当中，要为某个对象加上背景色只有一种办法，那就是先做一个表格，在表格中设置完背景色，再把对象放进单元格。这样做比较麻烦，不但代码较多，还要为表格的大小和定位伤些脑筋。现在用CSS就可以轻松地直接搞定了，而且对象的范围很广，可以是一段文字，也可以只是一个单词或一个字母。
基本格式如下：
background-color: 参数
参数取值和颜色属性一样。
背景图片
基本格式如下：
background-image: url(URL)
URL就是背景图片的存放路径。如果用“none”来代替背景图片的存放路径，将什么也不显示。
背景图片重复
背景图片重复控制的是背景图片平铺与否，也就是说，结合背景定位的控制可以在网页上的某处单独显示一幅背景图片。
基本格式如下：
background-repeat: 参数
参数取值范围：
·no-repeat：不重复平铺背景图片
·repeat-x：使图片只在水平方向上平铺
·repeat-y：使图片只在垂直方向上平铺
如果不指定背景图片重复属性，浏览器默认的是背景图片向水平、垂直两个方向上平铺。
背景图片固定
背景图片固定控制背景图片是否随网页的滚动而滚动。如果不设置背景图片固定属性，浏览器默认背景图片随网页的滚动而滚动。为了避免过于花哨的背景图片在滚动时伤害浏览者的视力，所以可以解除背景图片和文字内容的捆绑，该为和浏览器窗口捆绑。
基本格式如下：
background-attachment: 参数
参数取值范围：
·fixed：网页滚动时，背景图片相对于浏览器的窗口而言，固定不动
·scroll：网页滚动时，背景图片相对于浏览器的窗口而言，一起滚动
背景定位
背景定位用于控制背景图片在网页中显示的位置。
基本格式如下：
background-position: 参数表
参数取值范围：
·带长度单位的数字参数
·top：相对前景对象顶对齐
·bottom：相对前景对象底对齐
·left：相对前景对象左对齐
·right：相对前景对象右对齐
·center：相对前景对象中心对齐
·比例关系
参数中的center如果用于另外一个参数的前面，表示水平居中；如果用于另外一个参数的后面，表示垂直居中。
列表符号
列表符号是指显示于每一个列表项目前的符号标识。
基本格式如下：
list-style-type：参数
参数取值范围：
·disc：圆形
·circle：空心圆
·square：方块
·decimal：十进制数字
·lower-roman：小写罗马数字
·upper-roman：大写罗马数字
·lower-alpha：小写希腊字母
·upper-alpha：大写希腊字母
·none：无符号显示
参数中的disc是默认选项。
图形符号
图形符号指原来列表的项目符号将可以使用图形来代替。
基本格式如下：
list-style-image：URL
URL是用来代替项目符号的图形文件的地址，可以使用相对地址或绝对地址。
列表位置
列表位置描述列表在何处显示。
基本格式如下：
list-style-position：参数
参数取值范围：
·inside：在BOX模型内部显示
·outside：在BOX模型外部显示
这里又出现了一个新的概念：BOX模型。BOX是指一种容器，包含了应用样式规则的对象，具体介绍将在后文中给出。
在网页上，鼠标平时呈箭头形，指向链接时成为手形，等待网页下载时成为沙漏形……这似乎是约定俗成的。虽然这样的设计能使我们知道浏览器现在的状态或是可以做什么，但这些好像还不能完全地满足我们的需要。就拿链接来说，可以是指向一个帮助文件，也可以是向前进一页或是向后退一页，针对如此多的功能光靠千篇一律的手形鼠标是不能说明问题的。值得庆幸的是，CSS提供了多达13种的鼠标形状，供我们选择。
基本格式如下：
cursor：鼠标形状参数
CSS鼠标形状参数表：
CSS代码
鼠标形状
style="cursor:hand"
手形
style="cursor:crosshair"
十字形
style="cursor:text"
文本形
style="cursor:wait"
沙漏形
style="cursor:move"
十字箭头形
style="cursor:help"
问号形
style="cursor:e-resize"
右箭头形
style="cursor:n-resize"
上箭头形
style="cursor:nw-resize"
左上箭头形
style="cursor:w-resize"
左箭头形
style="cursor:s-resize"
下箭头形
style="cursor:se-resize"
右下箭头形
style="cursor:sw-resize"
左下箭头形
边框空白（MARGIN）
如图所示，位于BOX模型的最外层，包括四项属性。
格式分别如下：
·margin-top：顶部空白距离
·margin-right：右边空白距离
·margin-bottom：底部空白距离
·margin-left：左边空白距离
空白的距离可以用带长度单位的数字表示。
如果使用上述属性的简化方式margin，可以在其后连续加上四个带长度单位的数字，来分别表示margin-top、margin-right、margin-bottom、margin-left，每个数字中间要用空格分隔。
对象边框（BORDER）
如图所示，位于边框空白和对象空隙之间，包括了七项属性。
格式分别如下：
·border-top：顶边框宽度
·border-right：右边框宽度
·border-bottom：底边框宽度
·border-left：左边框宽度
·border-width：所有边框宽度
·border-color：边框颜色
·border-style：边框样式参数
其中border-width可以一次性设置所有的边框宽度，border-color同时设置四面边框的颜色时，可以连续写上四种颜色，并用空格分隔。上述连续设置的边框都是按border-top、border-right、border-bottom、border-left的顺序。
Border-style相对别的属性而言稍稍复杂些，因为它还包括了多个边框样式的参数：
·none：无边框。
·dotted：边框为点线。
·dashed：边框为长短线。
·solid：边框为实线。
·double：边框为双线。
·groove：根据color属性显示不同效果的3D边框
·ridge：根据color属性显示不同效果的3D边框
·inset：根据color属性显示不同效果的3D边框
·outset：根据color属性显示不同效果的3D边框
对象间隙（PADDING）
如图所示，位于对象边框和对象之间，包括了四项属性。
基本格式如下
·padding-top：顶部间隙
·padding-right：右边间隙
·padding-bottom：底部间隙
·padding-left：左边间隙
和MARGIN类似，PADDING也可以用padding一次性设置所有的对象间隙，格式也和MARGIN相似，不再一一列举了。
显示控制样式
基本格式如下：
display: 参数
参数取值范围：
·block（默认）：在对象前后都换行
·inline：在对象前后都不换行
·list-item：在对象前后都换行，增加了项目符号
·none：无显示
空白控制样式
基本格式如下：
空白属性决定如何处理元素内的空格。
white-space: 参数
参数取值范围：
normal：把多个空格替换为一个来显示
pre：忠实地按输入显示空格
nowrap：禁止换行
但要注意的是，write-space也是一个块级属性。

王永庆 2007-11-26 17:17 发表评论

正则表达式学习

王永庆 — Mon, 26 Nov 2007 09:16:00 GMT

正则表达式使用详解

简单的说，正则表达式是一种可以用于模式匹配和替换的强有力的工具。其作用如下：
测试字符串的某个模式。例如，可以对一个输入字符串进行测试，看在该字符串是否存在一个电话号码模式或一个信用卡号码模式。

基本语法

正则表达式的形式一般如下：
　　

/love/　　其中位于“/”定界符之间的部分就是将要在目标对象中进行匹配的模式。为了能够使用户更加灵活的定制模式内容，正则表达式提供了专门的“元字符”。所谓元字符就是指那些在正则表达式中具有特殊意义的专用字符，可以用来规定其前导字符（即位于元字符前面的字符）在目标对象中的出现模式。

较为常用的元字符包括： “+”， “*”，以及 “?”。

“+”元字符规定其前导字符必须在目标对象中连续出现一次或多次。

“*”元字符规定其前导字符必须在目标对象中出现零次或连续多次。

“?”元字符规定其前导对象必须在目标对象中连续出现零次或一次。

下面，就让我们来看一下正则表达式元字符的具体应用。

/fo+/　　因为上述正则表达式中包含“+”元字符，表示可以与目标对象中的 “fool”, “fo”, 或者 “football”等在字母f后面连续出现一个或多个字母o的字符串相匹配。

/eg*/　　因为上述正则表达式中包含“*”元字符，表示可以与目标对象中的 “easy”, “ego”, 或者 “egg”等在字母e后面连续出现零个或多个字母g的字符串相匹配。

/Wil?/　　因为上述正则表达式中包含“？”元字符，表示可以与目标对象中的 “Win”, 或者“Wilson”,等在字母i后面连续出现零个或一个字母l的字符串相匹配。

有时候不知道要匹配多少字符。为了能适应这种不确定性，正则表达式支持限定符的概念。这些限定符可以指定正则表达式的一个给定组件必须要出现多少次才能满足匹配。

{n} n 是一个非负整数。匹配确定的 n 次。例如，'o{2}' 不能匹配 "Bob" 中的 'o'，但是能匹配 "food" 中的两个 o。

{n,} n 是一个非负整数。至少匹配 n 次。例如，'o{2,}' 不能匹配 "Bob" 中的 'o'，但能匹配 "foooood" 中的所有 o。'o{1,}' 等价于 'o+'。'o{0,}' 则等价于 'o*'。

{n,m} m 和 n 均为非负整数，其中n <= m。最少匹配 n 次且最多匹配 m 次。例如，"o{1,3}" 将匹配 "fooooood" 中的前三个 o。'o{0,1}' 等价于 'o?'。请注意在逗号和两个数之间不能有空格。
在对如何使用正则表达式有了初步了解之后，我们来看一下其它几个重要的元字符的使用方式。

1.\s：用于匹配单个空格符，包括tab键和换行符；

2.\S：用于匹配除单个空格符之外的所有字符；

3.\d：用于匹配从0到9的数字；

4.\w：用于匹配字母，数字或下划线字符；

5.\W：用于匹配所有与\w不匹配的字符；

6.：用于匹配除换行符之外的所有字符。

下面，我们就通过实例看一下如何在正则表达式中使用上述元字符。
/\s+/ 上述正则表达式可以用于匹配目标对象中的一个或多个空格字符。
/\d000/　如果我们手中有一份复杂的财务报表，那么我们可以通过上述正则表达式轻而易举的查找到所有总额达千元的款项。

除了我们以上所介绍的元字符之外，正则表达式中还具有另外一种较为独特的专用字符，即定位符。定位符用于规定匹配模式在目标对象中的出现位置。较为常用的定位符包括： “^”, “$”, “\b” 以及 “\B”。

代码

1.“^”定位符规定匹配模式必须出现在目标字符串的开头

2.“$”定位符规定匹配模式必须出现在目标对象的结尾

3.“\b”定位符规定匹配模式必须出现在目标字符串的开头或结尾的两个边界之一

4.“\B”定位符则规定匹配对象必须位于目标字符串的开头和结尾两个边界之内，

5. 即匹配对象既不能作为目标字符串的开头，也不能作为目标字符串的结尾。

同样，我们也可以把“^”和“$”以及“\b”和“\B”看作是互为逆运算的两组定位符。举例来说： /^hell/　因为上述正则表达式中包含“^”定位符，所以可以与目标对象中以 “hell”, “hello”或“hellhound”开头的字符串相匹配。 /ar$/　因为上述正则表达式中包含“$”定位符，所以可以与目标对象中以 “car”, “bar”或 “ar” 结尾的字符串相匹配。 /\bbom/　因为上述正则表达式模式以“\b”定位符开头，所以可以与目标对象中以 “bomb”, 或 “bom”开头的字符串相匹配。/man\b/　因为上述正则表达式模式以“\b”定位符结尾，所以可以与目标对象中以 “human”, “woman”或 “man”结尾的字符串相匹配。
为了能够方便用户更加灵活的设定匹配模式，正则表达式允许使用者在匹配模式中指定某一个范围而不局限于具体的字符。例如：

代码

1./[A-Z]/　　上述正则表达式将会与从A到Z范围内任何一个大写字母相匹配。

2./[a-z]/　　上述正则表达式将会与从a到z范围内任何一个小写字母相匹配。

3./[0-9]/ 　上述正则表达式将会与从0到9范围内任何一个数字相匹配。

4./([a-z][A-Z][0-9])+/　上述正则表达式将会与任何由字母和数字组成的字符串，如 “aB0” 等相匹配。

      这里需要提醒用户注意的一点就是可以在正则表达式中使用 “()” 把字符串组合在一起。“()”符号包含的内容必须同时出现在目标对象中。因此，上述正则表达式将无法与诸如 “abc”等的字符串匹配，因为“abc”中的最后一个字符为字母而非数字。
如果我们希望在正则表达式中实现类似编程逻辑中的“或”运算，在多个不同的模式中任选一个进行匹配的话，可以使用管道符 “|”。例如：/to|too|2/　上述正则表达式将会与目标对象中的 “to”, “too”, 或 “2” 相匹配。
      正则表达式中还有一个较为常用的运算符，即否定符 “[^]”。与我们前文所介绍的定位符 “^” 不同，否定符 “[^]”规定目标对象中不能存在模式中所规定的字符串。例如：/[^A-C]/　上述字符串将会与目标对象中除A，B，和C之外的任何字符相匹配。一般来说，当“^”出现在 “[]”内时就被视做否定运算符；而当“^”位于“[]”之外，或没有“[]”时，则应当被视做定位符。
      最后，当用户需要在正则表达式的模式中加入元字符，并查找其匹配对象时，可以使用转义符“\”。例如：/Th\*/ 　上述正则表达式将会与目标对象中的“Th*”而非“The”等相匹配。
      在构造正则表达式之后，就可以象数学表达式一样来求值，也就是说，可以从左至右并按照一个优先级顺序来求值。优先级如下：

代码

1．\ 转义符

2．(), (?:), (?=), [] 圆括号和方括号

3．*, +, ?, {n}, {n,}, {n,m} 限定符

4．^, $, \anymetacharacter 位置和顺序

5．|“或”操作

使用实例
在JavaScript 1.2中带有一个功能强大的RegExp()对象，可以用来进行正则表达式的匹配操作。其中的test()方法可以检验目标对象中是否包含匹配模式，并相应的返回true或false。
我们可以使用JavaScript编写以下脚本，验证用户输入的邮件地址的有效性。

代码

正则表达式对象
本对象包含正则表达式模式以及表明如何应用模式的标志。

代码

语法 1 re = /pattern/[flags]
语法 2 re = new RegExp("pattern",["flags"])

参数
re
必选项。将要赋值为正则表达式模式的变量名。

Pattern
必选项。要使用的正则表达式模式。如果使用语法 1，用 "/" 字符分隔模式。如果用语法 2，用引号将模式引起来。

Flags
可选项。如果使用语法 2 要用引号将 flag 引起来。标志可以组合使用，可用的有：

代码

g （全文查找出现的所有 pattern）
i （忽略大小写）
m （多行查找）

示例
下面的示例创建一个包含正则表达式模式及相关标志的对象(re)，向您演示正则表达式对象的用法。在本例中，作为结果的正则表达式对象又用于 match 方法中：

代码

function MatchDemo()
{
var r, re; // 声明变量。
var s = "The rain in Spain falls mainly in the plain";
re = new RegExp("ain","g"); // 创建正则表达式对象。
r = s.match(re); // 在字符串 s 中查找匹配。
return(r);
}

返回值： ain,ain,ain,ain\\
属性 lastIndex 属性 | source 属性\\
方法 compile 方法 | exec 方法 | test 方法\\

exec 方法
用正则表达式模式在字符串中运行查找，并返回包含该查找结果的一个数组。
rgExp.exec(str)

参数

rgExp
必选项。包含正则表达式模式和可用标志的正则表达式对象

str
必选项。要在其中执行查找的 String 对象或字符串文字。
如果 exec 方法没有找到匹配，则它返回 null。如果它找到匹配，则 exec 方法返回一个数组，并且更新全局 RegExp 对象的属性，以反映匹配结果。数组的0元素包含了完整的匹配，而第1到n元素中包含的是匹配中出现的任意一个子匹配。这相当于没有设置全局标志 (g) 的 match 方法。
如果为正则表达式设置了全局标志，exec 从以 lastIndex 的值指示的位置开始查找。如果没有设置全局标志，exec 忽略 lastIndex 的值，从字符串的起始位置开始搜索。

exec 方法返回的数组有三个属性，分别是 input、index 和 lastIndex。Input 属性包含了整个被查找的字符串。Index 属性中包含了整个被查找字符串中被匹配的子字符串的位置。LastIndex 属性中包含了匹配中最后一个字符的下一个位置。

示例\\
下面的例子举例说明了 exec 方法的用法：

代码

function RegExpTest()
{
var ver = Number(ScriptEngineMajorVersion() + "." + ScriptEngineMinorVersion())
if (ver >= 5.5){ // 测试 JScript 的版本。
var src = "The rain in Spain falls mainly in the plain.";
var re = /\w+/g; // 创建正则表达式模式。
var arr;
while ((arr = re.exec(src)) != null)
document.write(arr.index + "-" + arr.lastIndex + arr + "\t");
}
else{
alert("请使用 JScript 的更新版本");
}
}

test 方法\\
返回一个 Boolean 值，它指出在被查找的字符串中是否存在模式。
rgexp.test(str)

参数\\
rgexp
必选项。包含正则表达式模式或可用标志的正则表达式对象。

str
必选项。要在其上测试查找的字符串。

说明
test 方法检查在字符串中是否存在一个模式，如果存在则返回 true，否则就返回 false。
全局 RegExp 对象的属性不由 test 方法来修改。

示例
下面的例子举例说明了 test 方法的用法：

代码

function TestDemo(re, s)
{
var s1; // 声明变量。
// 检查字符串是否存在正则表达式。
if (re.test(s)) // 测试是否存在。
s1 = " contains "; // s 包含模式。
else
s1 = " does not contain "; // s 不包含模式。
return("'" + s + "'" + s1 + "'"+ re.source + "'"); // 返回字符串。
}

match 方法
使用正则表达式模式对字符串执行查找，并将包含查找的结果作为数组返回。\\
stringObj.match(rgExp)

参数\\
stringObj
必选项。对其进行查找的 String 对象或字符串文字。

rgExp
必选项。为包含正则表达式模式和可用标志的正则表达式对象。也可以是包含正则表达式模式和可用标志的变量名或字符串文字。

说明\\
如果 match 方法没有找到匹配，返回 null。如果找到匹配返回一个数组并且更新全局 RegExp 对象的属性以反映匹配结果。
match 方法返回的数组有三个属性：input、index 和 lastIndex。Input 属性包含整个的被查找字符串。Index 属性包含了在整个被查找字符串中匹配的子字符串的位置。LastIndex 属性包含了最后一次匹配中最后一个字符的下一个位置。
如果没有设置全局标志 (g)，数组的 0 元素包含整个匹配，而第 1 到 n 元素包含了匹配中曾出现过的任一个子匹配。这相当于没有设置全局标志的 exec 方法。如果设置了全局标志，元素 0 到 n 中包含所有匹配。

示例\\
下面的示例演示了match 方法的用法：

代码

function MatchDemo()
{
var r, re; // 声明变量。
var s = "The rain in Spain falls mainly in the plain";
re = /ain/i; // 创建正则表达式模式。
r = s.match(re); // 尝试匹配搜索字符串。
return(r); // 返回第一次出现 "ain" 的地方。
}

本示例说明带 g 标志设置的 match 方法的用法。

代码

function MatchDemo()
{
var r, re; // 声明变量。
var s = "The rain in Spain falls mainly in the plain";
re = /ain/ig; // 创建正则表达式模式。
r = s.match(re); // 尝试去匹配搜索字符串。
return(r); // 返回的数组包含了所有 "ain"
// 出现的四个匹配。
}

上面几行代码演示了字符串文字的 match 方法的用法。

代码

var r, re = "Spain";
r = "The rain in Spain".replace(re, "Canada");
return r;

search 方法
返回与正则表达式查找内容匹配的第一个子字符串的位置。

stringObj.search(rgExp)

参数\\
stringObj
必选项。要在其上进行查找的 String 对象或字符串文字。

rgExp
必选项。包含正则表达式模式和可用标志的正则表达式对象。

search 方法指明是否存在相应的匹配。如果找到一个匹配，search 方法将返回一个整数值，指明这个匹配距离字符串开始的偏移位置。如果没有找到匹配，则返回 -1。

示例\\
下面的示例演示了 search 方法的用法。

代码

function SearchDemo()
{
var r, re; // 声明变量。
var s = "The rain in Spain falls mainly in the plain.";
re = /falls/i; // 创建正则表达式模式。
r = s.search(re); // 查找字符串。
return(r); // 返回 Boolean 结果。
}

正则表达式语法
一个正则表达式就是由普通字符（例如字符 a 到 z）以及特殊字符（称为元字符）组成的文字模式。该模式描述在查找文字主体时待匹配的一个或多个字符串。正则表达式作为一个模板，将某个字符模式与所搜索的字符串进行匹配。

这里有一些可能会遇到的正则表达式示例：

代码

JScript VBScript 匹配
/^\[ \t]*$/ "^\[ \t]*$" 匹配一个空白行。
/\d{2}-\d{5}/ "\d{2}-\d{5}" 验证一个ID 号码是否由一个2位数字，一个连字符以及一个5位数字组成。
/<(.*)>.*<\/\1>/ "<(.*)>.*<\/\1>" 匹配一个 HTML 标记。

下表是元字符及其在正则表达式上下文中的行为的一个完整列表：

字符描述
\ 将下一个字符标记为一个特殊字符、或一个原义字符、或一个后向引用、或一个八进制转义符。例如，'n' 匹配字符 "n"。'\n' 匹配一个换行符。序列 '\\' 匹配 "\" 而 "\(" 则匹配 "("。

^ 匹配输入字符串的开始位置。如果设置了 RegExp 对象的 Multiline 属性，^ 也匹配 '\n' 或 '\r' 之后的位置。

$ 匹配输入字符串的结束位置。如果设置了RegExp 对象的 Multiline 属性，$ 也匹配 '\n' 或 '\r' 之前的位置。

* 匹配前面的子表达式零次或多次。例如，zo* 能匹配 "z" 以及 "zoo"。 * 等价于{0,}。

+ 匹配前面的子表达式一次或多次。例如，'zo+' 能匹配 "zo" 以及 "zoo"，但不能匹配 "z"。+ 等价于 {1,}。

? 匹配前面的子表达式零次或一次。例如，"do(es)?" 可以匹配 "do" 或 "does" 中的"do" 。? 等价于 {0,1}。

{n} n 是一个非负整数。匹配确定的 n 次。例如，'o{2}' 不能匹配 "Bob" 中的 'o'，但是能匹配 "food" 中的两个 o。

{n,} n 是一个非负整数。至少匹配n 次。例如，'o{2,}' 不能匹配 "Bob" 中的 'o'，但能匹配 "foooood" 中的所有 o。'o{1,}' 等价于 'o+'。'o{0,}' 则等价于 'o*'。

{n,m} m 和 n 均为非负整数，其中n <= m。最少匹配 n 次且最多匹配 m 次。刘， "o{1,3}" 将匹配 "fooooood" 中的前三个 o。'o{0,1}' 等价于 'o?'。请注意在逗号和两个数之间不能有空格。

? 当该字符紧跟在任何一个其他限制符 (*, +, ?, {n}, {n,}, {n,m}) 后面时，匹配模式是非贪婪的。非贪婪模式尽可能少的匹配所搜索的字符串，而默认的贪婪模式则尽可能多的匹配所搜索的字符串。例如，对于字符串 "oooo"，'o+?' 将匹配单个 "o"，而 'o+' 将匹配所有 'o'。

. 匹配除 "\n" 之外的任何单个字符。要匹配包括 '\n' 在内的任何字符，请使用象 '[.\n]' 的模式。
(pattern) 匹配pattern 并获取这一匹配。所获取的匹配可以从产生的 Matches 集合得到，在VBScript 中使用 SubMatches 集合，在JScript 中则使用 $0…$9 属性。要匹配圆括号字符，请使用 '$' 或 '$'。

(?:pattern) 匹配 pattern 但不获取匹配结果，也就是说这是一个非获取匹配，不进行存储供以后使用。这在使用 "或" 字符 (|) 来组合一个模式的各个部分是很有用。例如， 'industr(?:y|ies) 就是一个比 'industry|industries' 更简略的表达式。

(?=pattern) 正向预查，在任何匹配 pattern 的字符串开始处匹配查找字符串。这是一个非获取匹配，也就是说，该匹配不需要获取供以后使用。例如， 'Windows (?=95|98|NT|2000)' 能匹配 "Windows 2000" 中的 "Windows" ，但不能匹配 "Windows 3.1" 中的 "Windows"。预查不消耗字符，也就是说，在一个匹配发生后，在最后一次匹配之后立即开始下一次匹配的搜索，而不是从包含预查的字符之后开始。

(?!pattern) 负向预查，在任何不匹配Negative lookahead matches the search string at any point where a string not matching pattern 的字符串开始处匹配查找字符串。这是一个非获取匹配，也就是说，该匹配不需要获取供以后使用。例如'Windows (?!95|98|NT|2000)' 能匹配 "Windows 3.1" 中的 "Windows"，但不能匹配 "Windows 2000" 中的 "Windows"。预查不消耗字符，也就是说，在一个匹配发生后，在最后一次匹配之后立即开始下一次匹配的搜索，而不是从包含预查的字符之后开始

x|y 匹配 x 或 y。例如，'z|food' 能匹配 "z" 或 "food"。'(z|f)ood' 则匹配 "zood" 或 "food"。

[xyz] 字符集合。匹配所包含的任意一个字符。例如， '[abc]' 可以匹配 "plain" 中的 'a'。

[^xyz] 负值字符集合。匹配未包含的任意字符。例如， '[^abc]' 可以匹配 "plain" 中的'p'。

[a-z] 字符范围。匹配指定范围内的任意字符。例如，'[a-z]' 可以匹配 'a' 到 'z' 范围内的任意小写字母字符。

[^a-z] 负值字符范围。匹配任何不在指定范围内的任意字符。例如，'[^a-z]' 可以匹配任何不在 'a' 到 'z' 范围内的任意字符。

\b 匹配一个单词边界，也就是指单词和空格间的位置。例如， 'er\b' 可以匹配"never" 中的 'er'，但不能匹配 "verb" 中的 'er'。

\B 匹配非单词边界。'er\B' 能匹配 "verb" 中的 'er'，但不能匹配 "never" 中的 'er'。

\cx 匹配由x指明的控制字符。例如， \cM 匹配一个 Control-M 或回车符。 x 的值必须为 A-Z 或 a-z 之一。否则，将 c 视为一个原义的 'c' 字符。

\d 匹配一个数字字符。等价于 [0-9]。

\D 匹配一个非数字字符。等价于 [^0-9]。

\f 匹配一个换页符。等价于 \x0c 和 \cL。

\n 匹配一个换行符。等价于 \x0a 和 \cJ。

\r 匹配一个回车符。等价于 \x0d 和 \cM。

\s 匹配任何空白字符，包括空格、制表符、换页符等等。等价于 [ \f\n\r\t\v]。

\S 匹配任何非空白字符。等价于 [^ \f\n\r\t\v]。

\t 匹配一个制表符。等价于 \x09 和 \cI。

\v 匹配一个垂直制表符。等价于 \x0b 和 \cK。

\w 匹配包括下划线的任何单词字符。等价于'[A-Za-z0-9_]'。

\W 匹配任何非单词字符。等价于 '[^A-Za-z0-9_]'。

\xn 匹配 n，其中 n 为十六进制转义值。十六进制转义值必须为确定的两个数字长。例如， '\x41' 匹配 "A"。'\x041' 则等价于 '\x04' & "1"。正则表达式中可以使用 ASCII 编码。.

\num 匹配 num，其中 num 是一个正整数。对所获取的匹配的引用。例如，'(.)\1' 匹配两个连续的相同字符。

\n 标识一个八进制转义值或一个后向引用。如果 \n 之前至少 n 个获取的子表达式，则 n 为后向引用。否则，如果 n 为八进制数字 (0-7)，则 n 为一个八进制转义值。

\nm 标识一个八进制转义值或一个后向引用。如果 \nm 之前至少有is preceded by at least nm 个获取得子表达式，则 nm 为后向引用。如果 \nm 之前至少有 n 个获取，则 n 为一个后跟文字 m 的后向引用。如果前面的条件都不满足，若 n 和 m 均为八进制数字 (0-7)，则 \nm 将匹配八进制转义值 nm。

\nml 如果 n 为八进制数字 (0-3)，且 m 和 l 均为八进制数字 (0-7)，则匹配八进制转义值 nml。

\un 匹配 n，其中 n 是一个用四个十六进制数字表示的 Unicode 字符。例如， \u00A9 匹配版权符号 (?)。

优先权顺序
在构造正则表达式之后，就可以象数学表达式一样来求值，也就是说，可以从左至右并按照一个优先权顺序来求值。

下表从最高优先级到最低优先级列出各种正则表达式操作符的优先权顺序：
代码

操作符描述
\ 转义符
(), (?:), (?=), [] 圆括号和方括号
*, +, ?, {n}, {n,}, {n,m} 限定符
^, $, \anymetacharacter 位置和顺序
| “或”操作

普通字符

普通字符由所有那些未显式指定为元字符的打印和非打印字符组成。这包括所有的大写和小写字母字符，所有数字，所有标点符号以及一些符号。

最简单的正则表达式是一个单独的普通字符，可以匹配所搜索字符串中的该字符本身。例如，单字符模式 'A' 可以匹配所搜索字符串中任何位置出现的字母 'A'。这里有一些单字符正则表达式模式的示例：
代码

/7/

/M/

/a/

王永庆 2007-11-26 17:16 发表评论