正则表达式

    技术2022-05-11  105

    JS的正则表达式

    //校验是否全由数字组成代码

       1. function isDigit(s)     2. {     3. var patrn=/^[0-9]{1,20}$/;     4. if (!patrn.exec(s)) return false     5. return true     6. } 

    //校验登录名:只能输入5-20个以字母开头、可带数字、“_”、“.”的字串代码

       1. function isRegisterUserName(s)     2. {     3. var patrn=/^[a-zA-Z]{1}([a-zA-Z0-9]|[._]){4,19}$/;     4. if (!patrn.exec(s)) return false     5. return true     6. } 

    //校验用户姓名:只能输入1-30个以字母开头的字串代码

       1. function isTrueName(s)     2. {     3. var patrn=/^[a-zA-Z]{1,30}$/;     4. if (!patrn.exec(s)) return false     5. return true     6. }     7. }}     8.      9. //校验密码:只能输入6-20个字母、数字、下划线    10. [code]    11. function isPasswd(s)    12. {    13. var patrn=/^(/w){6,20}$/;    14. if (!patrn.exec(s)) return false    15. return true    16. } 

    //校验普通电话、传真号码:可以“+”开头,除数字外,可含有“-”代码

       1. function isTel(s)     2. {     3. //var patrn=/^[+]{0,1}(/d){1,3}[ ]?([-]?(/d){1,12})+$/;     4. var patrn=/^[+]{0,1}(/d){1,3}[ ]?([-]?((/d)|[ ]){1,12})+$/;     5. if (!patrn.exec(s)) return false     6. return true     7. } 

    //校验手机号码:必须以数字开头,除数字外,可含有“-”代码

       1. function isMobil(s)     2. {     3. var patrn=/^[+]{0,1}(/d){1,3}[ ]?([-]?((/d)|[ ]){1,12})+$/;     4. if (!patrn.exec(s)) return false     5. return true     6. } 

    //校验邮政编码代码

       1. function isPostalCode(s)     2. {     3. //var patrn=/^[a-zA-Z0-9]{3,12}$/;     4. var patrn=/^[a-zA-Z0-9 ]{3,12}$/;     5. if (!patrn.exec(s)) return false     6. return true     7. } 

    //校验搜索关键字代码

       1. function isSearch(s)     2. {     3. var patrn=/^[^`~!@#$%^&*()+=|///][/]/{/}:;'/,.<>/?]{1}[^`~!@$%^&()+=|///]     4.         [/]/{/}:;'/,.<>?]{0,19}$/;     5. if (!patrn.exec(s)) return false     6. return true     7. }     8.      9. function isIP(s) //by zergling    10. {    11. var patrn=/^[0-9.]{1,20}$/;    12. if (!patrn.exec(s)) return false    13. return true    14. } 

    正则表达式代码

       1. "^//d+$"  //非负整数(正整数 + 0)     2. "^[0-9]*[1-9][0-9]*$"  //正整数      3. "^((-//d+)|(0+))$"  //非正整数(负整数 + 0)      4. "^-[0-9]*[1-9][0-9]*$"  //负整数      5. "^-?//d+$"    //整数      6. "^//d+(//.//d+)?$"  //非负浮点数(正浮点数 + 0)      7. "^(([0-9]+//.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*//.[0-9]+)|([0-9]*[1-9][0-9]*))$"      8. //正浮点数      9. "^((-//d+(//.//d+)?)|(0+(//.0+)?))$"  //非正浮点数(负浮点数 + 0)     10. "^(-(([0-9]+//.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*//.[0-9]+)|([0-9]*[1-9][0-9]*)))$"     11. //负浮点数     12. "^(-?//d+)(//.//d+)?$"  //浮点数     13. "^[A-Za-z]+$"  //由26个英文字母组成的字符串     14. "^[A-Z]+$"  //由26个英文字母的大写组成的字符串     15. "^[a-z]+$"  //由26个英文字母的小写组成的字符串     16. "^[A-Za-z0-9]+$"  //由数字和26个英文字母组成的字符串     17. "^//w+$"  //由数字、26个英文字母或者下划线组成的字符串     18. "^[//w-]+(//.[//w-]+)*@[//w-]+(//.[//w-]+)+$"    //email地址     19. "^[a-zA-z]+://(//w+(-//w+)*)(//.(//w+(-//w+)*))*(//?//S*)?$"  //url    20. "^[A-Za-z0-9_]*$"  

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

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

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

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

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

       1. g (全文查找出现的所有 pattern)      2. i (忽略大小写)      3. m (多行查找)  

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

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

    返回值: ain,ain,ain,ain//属性 lastIndex 属性 | source 属性//方法 compile 方法 | exec 方法 | test 方法//要求 版本 3//请参阅 RegExp 对象 | 正则表达式语法 | String 对象//

    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 方法的用法:代码

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

    返回值:0-3The 4-8rain 9-11in 12-17Spain 18-23falls 24-30mainly 31-33in 34-37the 38-43plain

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

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

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

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

    示例下面的例子举例说明了 test 方法的用法:代码

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

    函数调用:document.write (TestDemo(/ain+/ ,"The rain in Spain falls mainly in the plain."));

    返回值:'The rain in Spain falls mainly in the plain.' contains 'ain+'

    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 方法的用法:代码

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

    返回值:ain

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

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

    返回值:ain,ain,ain,ain

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

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

    返回值:The rain in Canada

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

    stringObj.search(rgExp)

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

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

    说明

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

    示例//下面的示例演示了 search 方法的用法。代码

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

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

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

       1. JScript VBScript 匹配      2. /^/[ /t]*$/ "^/[ /t]*$" 匹配一个空白行。      3. //d{2}-/d{5}/ "/d{2}-/d{5}" 验证一个ID 号码是否由一个2位数字,一个连字符以及一个5位数字组成。      4. /<(.*)>.*<///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 匹配版权符号 (?)。

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

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

       1. 操作符 描述      2. / 转义符      3. (), (?, (?=), [] 圆括号和方括号      4. *, +, ?, {n}, {n,}, {n,m} 限定符      5. ^, $, /anymetacharacter 位置和顺序      6. | “或”操作  

    普通字符

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

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

       1. /a/     2. /7/     3. /M/ 

    等价的 VBScript 单字符正则表达式为:代码

       1. "a"     2. "7"     3. "M" 

    可以将多个单字符组合在一起得到一个较大的表达式。例如,下面的 JScript 正则表达式不是别的,就是通过组合单字符表达式 'a'、'7'以及 'M' 所创建出来的一个表达式。

    /a7M/等价的 VBScript 表达式为:

    "a7M"请注意这里没有连接操作符。所需要做的就是将一个字符放在了另一个字符后面。

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

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

       1. JScript VBScript 匹配      2. /^/[ /t]*$/ "^/[ /t]*$" 匹配一个空白行。      3. //d{2}-/d{5}/ "/d{2}-/d{5}" 验证一个ID 号码是否由一个2位数字,一个连字符以及一个5位数字组成。      4. /<(.*)>.*<///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 匹配版权符号 (?)。

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

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

       1. 操作符 描述      2. / 转义符      3. (), (?, (?=), [] 圆括号和方括号      4. *, +, ?, {n}, {n,}, {n,m} 限定符      5. ^, $, /anymetacharacter 位置和顺序      6. | “或”操作  

    普通字符

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

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

       1. /a/     2. /7/     3. /M/ 

    等价的 VBScript 单字符正则表达式为:代码

       1. "a"     2. "7"     3. "M" 

    可以将多个单字符组合在一起得到一个较大的表达式。例如,下面的 JScript 正则表达式不是别的,就是通过组合单字符表达式 'a'、'7'以及 'M' 所创建出来的一个表达式。

    /a7M/等价的 VBScript 表达式为:

    "a7M"请注意这里没有连接操作符。所需要做的就是将一个字符放在了另一个字符后面。

    正则表达式使用详解简介

    简单的说,正则表达式是一种可以用于模式匹配和替换的强有力的工具。其作用如下:测试字符串的某个模式。例如,可以对一个输入字符串进行测试,看在该字符串是否存在一个电话号码模式或一个信用卡号码模式。这称为数据有效性验证。替换文本。可以在文档中使用一个正则表达式来标识特定文字,然后可以全部将其删除,或者替换为别的文字。根据模式匹配从字符串中提取一个子字符串。可以用来在文本或输入字段中查找特定文字。

    基本语法

    在对正则表达式的功能和作用有了初步的了解之后,我们就来具体看一下正则表达式的语法格式。正则表达式的形式一般如下:  

    /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?'。请注意在逗号和两个数之间不能有空格。

    除了元字符之外,用户还可以精确指定模式在匹配对象中出现的频率。例如,/jim {2,6}/ 上述正则表达式规定字符m可以在匹配对象中连续出现2-6次,因此,上述正则表达式可以同jimmy或jimmmmmy等字符串相匹配。在对如何使用正则表达式有了初步了解之后,我们来看一下其它几个重要的元字符的使用方式。代码

       1. /s:用于匹配单个空格符,包括tab键和换行符;      2. /S:用于匹配除单个空格符之外的所有字符;      3. /d:用于匹配从0到9的数字;      4. /w:用于匹配字母,数字或下划线字符;      5. /W:用于匹配所有与/w不匹配的字符;      6. . :用于匹配除换行符之外的所有字符。  

    (说明:我们可以把/s和/S以及/w和/W看作互为逆运算)下面,我们就通过实例看一下如何在正则表达式中使用上述元字符。//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. 1./ 转义符     2. 2.(), (?, (?=), [] 圆括号和方括号     3. 3.*, +, ?, {n}, {n,}, {n,m} 限定符     4. 4.^, $, /anymetacharacter 位置和顺序     5. 5.|“或”操作 

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

       1. <html>      2. <head>      3.   <script language="Javascript1.2">      4.      <!-- start hiding      5.      function verifyAddress(obj)      6.      {      7.       var email = obj.email.value;      8.       var pattern =      9. /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(/.[a-zA-Z0-9_-])+/;     10.       flag = pattern.test(email);     11.       if(flag)     12.       {     13.        alert(“Your email address is correct!”);     14.        return true;     15.       }     16.       else     17.        {     18.         alert(“Please try again!”);     19.         return false;     20.         }     21.       }     22.      // stop hiding -->     23.     </script>     24.   </head>     25.   <body>     26.    <form onSubmit="return verifyAddress(this);">     27.     <input name="email" type="text">     28.     <input type="submit">     29.     </form>     30.   </body>     31. </html>

     

    这篇介绍javascript方面的日志,我在是Clang上看到的。作者介绍挺全面的,所以转载过来让感兴趣的朋友看一下。呵呵~~~

    有些时候你精通一门语言,但是会发现你其实整天在和其它语言打交道,也许你以为这些微不足道,不至于影响你的开发进度,但恰恰是这些你不重视的东西会浪费你很多时间,我一直以为我早在几年前就已经精通JavaScript了,直到目前,我才越来越觉得JavaScript远比我想象的复杂和强大,我开始崇拜它,趁着节日的空隙,把有关JavaScript的方法和技巧整理下,让每个在为JavaScript而烦恼的人明白,JavaScript就这么回事!并希望JavaScript还可以成为你的朋友,让你豁然开朗,在项目中更好的应用~

    适合阅读范围:对JavaScript一无所知~离精通只差一步之遥的人基础知识:HTML

    JavaScript就这么回事1:基础知识

    1 创建脚本块

    1: <script language=”JavaScript”>2: JavaScript code goes here3: </script>

     

    2 隐藏脚本代码

    1: <script language=”JavaScript”>2: <!--3: document.write(“Hello”);4: // -->5: </script>

    在不支持JavaScript的浏览器中将不执行相关代码

    3 浏览器不支持的时候显示

    1: <noscript>2: Hello to the non-JavaScript browser.3: </noscript>

     

    4 链接外部脚本文件

    1: <script language=”JavaScript” src="/”filename.js"”></script>

    5 注释脚本

    1: // This is a comment2: document.write(“Hello”); // This is a comment3: /*4: All of this5: is a comment6: */

     

    6 输出到浏览器

    1: document.write(“<strong>Hello</strong>”);

     

    7 定义变量

    1: var myVariable = “some value”;

     

    8 字符串相加

    1: var myString = “String1” + “String2”;

     

    9 字符串搜索

    1: <script language=”JavaScript”>2: <!--3: var myVariable = “Hello there”;4: var therePlace = myVariable.search(“there”);5: document.write(therePlace);6: // -->7: </script>

     

    10 字符串替换

    1: thisVar.replace(“Monday”,”Friday”);

    11 格式化字串

    1: <script language=”JavaScript”>2: <!--3: var myVariable = “Hello there”;4: document.write(myVariable.big() + “<br/>”);5: document.write(myVariable.blink() + “<br/>”);6: document.write(myVariable.bold() + “<br/>”);7: document.write(myVariable.fixed() + “<br/>”);8: document.write(myVariable.fontcolor(“red”) + “<br/>”);9: document.write(myVariable.fontsize(“18pt”) + “<br/>”);10: document.write(myVariable.italics() + “<br/>”);11: document.write(myVariable.small() + “<br/>”);12: document.write(myVariable.strike() + “<br/>”);13: document.write(myVariable.sub() + “<br/>”);14: document.write(myVariable.sup() + “<br/>”);15: document.write(myVariable.toLowerCase() + “<br/>”);16: document.write(myVariable.toUpperCase() + “<br/>”);17: 18: var firstString = “My String”;19: var finalString = firstString.bold().toLowerCase().fontcolor(“red”);20: // -->21: </script>

     

    12 创建数组

    1: <script language=”JavaScript”>2: <!--3: var myArray = new Array(5);4: myArray[0] = “First Entry”;5: myArray[1] = “Second Entry”;6: myArray[2] = “Third Entry”;7: myArray[3] = “Fourth Entry”;8: myArray[4] = “Fifth Entry”;9: var anotherArray = new Array(“First Entry”,”Second Entry”,”Third Entry”,”Fourth Entry”,”Fifth Entry”);10: // -->11: </script>

     

    13 数组排序

    1: <script language=”JavaScript”>2: <!--3: var myArray = new Array(5);4: myArray[0] = “z”;5: myArray[1] = “c”;6: myArray[2] = “d”;7: myArray[3] = “a”;8: myArray[4] = “q”;9: document.write(myArray.sort());10: // -->11: </script>

     

    14 分割字符串

    1: <script language=”JavaScript”>2: <!--3: var myVariable = “a,b,c,d”;4: var stringArray = myVariable.split(“,”);5: document.write(stringArray[0]);6: document.write(stringArray[1]);7: document.write(stringArray[2]);8: document.write(stringArray[3]);9: // -->10: </script>

     

    15 弹出警告信息

    1: <script language=”JavaScript”>2: <!--3: window.alert(“Hello”);4: // -->5: </script>

     

    16 弹出确认框

    1: <script language=”JavaScript”>2: <!--3: var result = window.confirm(“Click OK to continue”);4: // -->5: </script>

     

    17 定义函数

    1: <script language=”JavaScript”>2: <!--3: function multiple(number1,number2) { 4: var result = number1 * number2;5: return result;6: }7: // -->8: </script>

     

    18 调用JS函数

    1: <a href=”#” onClick=”functionName()”>Link text</a>2: <a href="/”javascript:functionName"()”>Link text</a>

     

    19 在页面加载完成后执行函数

    1: <body onLoad=”functionName();”>2: Body of the page3: </body>

    20 条件判断

    1: <script>2: <!--3: var userChoice = window.confirm(“Choose OK or Cancel”);4: var result = (userChoice == true) ? “OK” : “Cancel”;5: document.write(result);6: // -->7: </script>

     

    21 指定次数循环

    1: <script>2: <!--3: var myArray = new Array(3);4: myArray[0] = “Item 0”;5: myArray[1] = “Item 1”;6: myArray[2] = “Item 2”;7: for (i = 0; i < myArray.length; i++) { 8: document.write(myArray[i] + “<br/>”);9: }10: // -->11: </script>

     

    22 设定将来执行

    1: <script>2: <!--3: function hello() { 4: window.alert(“Hello”);5: }6: window.setTimeout(“hello()”,5000);7: // -->8: </script>

     

    23 定时执行函数

    1: <script>2: <!--3: function hello() { 4: window.alert(“Hello”);5: window.setTimeout(“hello()”,5000);6: }7: window.setTimeout(“hello()”,5000);8: // -->9: </script>

     

    24 取消定时执行

    1: <script>2: <!--3: function hello() { 4: window.alert(“Hello”);5: }6: var myTimeout = window.setTimeout(“hello()”,5000);7: window.clearTimeout(myTimeout);8: // -->9: </script>

     

    25 在页面卸载时候执行函数

    1: <body onUnload=”functionName();”>2: Body of the page3: </body>

    JavaScript就这么回事2:浏览器输出

    26 访问document对象

    1: <script language=”JavaScript”>2: var myURL = document.URL;3: window.alert(myURL);4: </script>

     

    27 动态输出HTML

    1: <script language=”JavaScript”>2: document.write(“<p>Here’s some information about this document:</p>”);3: document.write(“<ul>”);4: document.write(“<li>Referring Document: “ + document.referrer + “</li>”);5: document.write(“<li>Domain: “ + document.domain + “</li>”);6: document.write(“<li>URL: “ + document.URL + “</li>”);7: document.write(“</ul>”);8: </script>

    28 输出换行

    1: document.writeln(“<strong>a</strong>”);2: document.writeln(“b”);

     

    29 输出日期

    1: <script language=”JavaScript”>2: var thisDate = new Date();3: document.write(thisDate.toString());4: </script>

     

    30 指定日期的时区

    1: <script language=”JavaScript”>2: var myOffset = -2;3: var currentDate = new Date();4: var userOffset = currentDate.getTimezoneOffset()/60;5: var timeZoneDifference = userOffset - myOffset;6: currentDate.setHours(currentDate.getHours() + timeZoneDifference);7: document.write(“The time and date in Central Europe is: “ + currentDate.toLocaleString());8: </script>

    31 设置日期输出格式

    1: <script language=”JavaScript”>2: var thisDate = new Date();3: var thisTimeString = thisDate.getHours() + “:” + thisDate.getMinutes();4: var thisDateString = thisDate.getFullYear() + “/” + thisDate.getMonth() + “/” + thisDate.getDate();5: document.write(thisTimeString + “ on “ + thisDateString);6: </script>

    32 读取URL参数

    1: <script language=”JavaScript”>2: var urlParts = document.URL.split(“?”);3: var parameterParts = urlParts[1].split(“&”);4: for (i = 0; i < parameterParts.length; i++) { 5: var pairParts = parameterParts[i].split(“=”);6: var pairName = pairParts[0];7: var pairValue = pairParts[1];8: document.write(pairName + “ :“ +pairValue );9: }10: </script>

    你还以为HTML是无状态的么?

    33 打开一个新的document对象

    1: <script language=”JavaScript”>2: function newDocument() { 3: document.open();4: document.write(“<p>This is a New Document.</p>”);5: document.close();6: }7: </script>

     

    34 页面跳转

    1: <script language=”JavaScript”>2: window.location = “http://www.liu21st.com/”;3: </script>

     

    35 添加网页加载进度窗口

    1: <html>2: <head>3: <script language='javaScript'>4: var placeHolder = window.open('holder.html','placeholder','width=200,height=200');5: </script>6: <title>The Main Page</title>7: </head>8: <body onLoad='placeHolder.close()'>9: <p>This is the main page</p>10: </body>11: </html>

    36 读取图像属性

    1: <img src="/”image1.jpg"” name=”myImage”>2: <a href=”# ” onClick=”window.alert(document.myImage.width)”>Width</a>3:

    37 动态加载图像

    1: <script language=”JavaScript”>2: myImage = new Image;3: myImage.src = “Tellers1.jpg”;4: </script>

    38 简单的图像替换

    1: <script language=”JavaScript”>2: rollImage = new Image;3: rollImage.src = “rollImage1.jpg”;4: defaultImage = new Image;5: defaultImage.src = “image1.jpg”;6: </script>7: <a href="/”myUrl"” onMouseOver=”document.myImage.src = rollImage.src;”8: onMouseOut=”document.myImage.src = defaultImage.src;”>9: <img src="/”image1.jpg"” name=”myImage” width=100 height=100 border=0>

    39 随机显示图像

    1: <script language=”JavaScript”>2: var imageList = new Array;3: imageList[0] = “image1.jpg”;4: imageList[1] = “image2.jpg”;5: imageList[2] = “image3.jpg”;6: imageList[3] = “image4.jpg”;7: var imageChoice = Math.floor(Math.random() * imageList.length);8: document.write(‘<img src=”’ + imageList[imageChoice] + ‘“>’);9: </script>

    40 函数实现的图像替换

    1: <script language=”JavaScript”>2: var source = 0;3: var replacement = 1;4: function createRollOver(originalImage,replacementImage) { 5: var imageArray = new Array;6: imageArray[source] = new Image;7: imageArray[source].src = originalImage;8: imageArray[replacement] = new Image;9: imageArray[replacement].src = replacementImage;10: return imageArray;11: }12: var rollImage1 = createRollOver(“image1.jpg”,”rollImage1.jpg”);13: </script>14: <a href=”#” onMouseOver=”document.myImage1.src = rollImage1[replacement].src;”15: onMouseOut=”document.myImage1.src = rollImage1[source].src;”>16: <img src="/”image1.jpg"” width=100 name=”myImage1” border=0>17: </a>

    41 创建幻灯片

    1: <script language=”JavaScript”>2: var imageList = new Array;3: imageList[0] = new Image;4: imageList[0].src = “image1.jpg”;5: imageList[1] = new Image;6: imageList[1].src = “image2.jpg”;7: imageList[2] = new Image;8: imageList[2].src = “image3.jpg”;9: imageList[3] = new Image;10: imageList[3].src = “image4.jpg”;11: function slideShow(imageNumber) { 12: document.slideShow.src = imageList[imageNumber].src;13: imageNumber += 1;14: if (imageNumber < imageList.length) { 15: window.setTimeout(“slideShow(“ + imageNumber + “)”,3000);16: }17: }18: </script>19: </head>20: <body onLoad=”slideShow(0)”>21: <img src="/”image1.jpg"” width=100 name=”slideShow”>

    42 随机广告图片

    1: <script language=”JavaScript”>2: var imageList = new Array;3: imageList[0] = “image1.jpg”;4: imageList[1] = “image2.jpg”;5: imageList[2] = “image3.jpg”;6: imageList[3] = “image4.jpg”;7: var urlList = new Array;8: urlList[0] = “http://some.host/”;9: urlList[1] = “http://another.host/”;10: urlList[2] = “http://somewhere.else/”;11: urlList[3] = “http://right.here/”;12: var imageChoice = Math.floor(Math.random() * imageList.length);13: document.write(‘<a href=”’ + urlList[imageChoice] + ‘“><img src=”’ + imageList[imageChoice] + ‘“></a>’);14: </script>

    JavaScript就这么回事4:表单

    还是先继续写完JS就这么回事系列吧~43 表单构成

    1: <form method=”post” action=”target.html” name=”thisForm”>2: <input type=”text” name=”myText”>3: <select name=”mySelect”>4: <option value=”1”>First Choice</option>5: <option value=”2”>Second Choice</option>6: </select>7: <br/>8: <input type=”submit” value=”Submit Me”>9: </form>

    44 访问表单中的文本框内容

    1: <form name=”myForm”>2: <input type=”text” name=”myText”>3: </form>4: <a href='#' onClick='window.alert(document.myForm.myText.value);'>Check Text Field</a>

    45 动态复制文本框内容

    1: <form name=”myForm”>2: Enter some Text: <input type=”text” name=”myText”><br/>3: Copy Text: <input type=”text” name=”copyText”>4: </form>5: <a href=”#” onClick=”document.myForm.copyText.value =6: document.myForm.myText.value;”>Copy Text Field</a>

    46 侦测文本框的变化

    1: <form name=”myForm”>2: Enter some Text: <input type=”text” name=”myText” onChange=”alert(this.value);”>3: </form>

    47 访问选中的Select

    1: <form name=”myForm”>2: <select name=”mySelect”>3: <option value=”First Choice”>1</option>4: <option value=”Second Choice”>2</option>5: <option value=”Third Choice”>3</option>6: </select>7: </form>8: <a href='#' onClick='alert(document.myForm.mySelect.value);'>Check Selection List</a>

    48 动态增加Select项

    1: <form name=”myForm”>2: <select name=”mySelect”>3: <option value=”First Choice”>1</option>4: <option value=”Second Choice”>2</option>5: </select>6: </form>7: <script language=”JavaScript”>8: document.myForm.mySelect.length++;9: document.myForm.mySelect.options[document.myForm.mySelect.length - 1].text = “3”;10: document.myForm.mySelect.options[document.myForm.mySelect.length - 1].value = “Third Choice”;11: </script>

    49 验证表单字段

    1: <script language=”JavaScript”>2: function checkField(field) { 3: if (field.value == “”) { 4: window.alert(“You must enter a value in the field”);5: field.focus();6: }7: }8: </script>9: <form name=”myForm” action=”target.html”>10: Text Field: <input type=”text” name=”myField”onBlur=”checkField(this)”>11: <br/><input type=”submit”>12: </form>

    50 验证Select项

    1: function checkList(selection) { 2: if (selection.length == 0) { 3: window.alert(“You must make a selection from the list.”);4: return false;5: }6: return true;7: }.

    51 动态改变表单的action

    1: <form name=”myForm” action=”login.html”>2: Username: <input type=”text” name=”username”><br/>3: Password: <input type=”password” name=”password”><br/>4: <input type=”button” value=”Login” onClick=”this.form.submit();”>5: <input type=”button” value=”Register” onClick=”this.form.action = ‘register.html’; this.form.submit();”>6: <input type=”button” value=”Retrieve Password” onClick=”this.form.action = ‘password.html’; this.form.submit();”>7: </form>

    52 使用图像按钮

    1: <form name=”myForm” action=”login.html”>2: Username: <input type=”text” name=”username”><br/>3: Password: <input type=”password”name=”password”><br/>4: <input type=”image” src="/”login.gif"” value=”Login”>5: </form>6:

    53 表单数据的加密

    1: <SCRIPT LANGUAGE='JavaScript'>2: <!--3: function encrypt(item) { 4: var newItem = '';5: for (i=0; i < item.length; i++) { 6: newItem += item.charCodeAt(i) + '.';7: }8: return newItem;9: }10: function encryptForm(myForm) { 11: for (i=0; i < myForm.elements.length; i++) { 12: myForm.elements[i].value = encrypt(myForm.elements[i].value);13: }14: }15: 16: //-->17: </SCRIPT>18: <form name='myForm' onSubmit='encryptForm(this); window.alert(this.myField.value);'>19: Enter Some Text: <input type=text name=myField><input type=submit>20: </form>

     

    JavaScript就这么回事5:窗口和框架

    54 改变浏览器状态栏文字提示

    1: <script language=”JavaScript”>2: window.status = “A new status message”;3: </script>

    55 弹出确认提示框

    1: <script language=”JavaScript”>2: var userChoice = window.confirm(“Click OK or Cancel”);3: if (userChoice) { 4: document.write(“You chose OK”);5: } else { 6: document.write(“You chose Cancel”);7: }8: </script>

    56 提示输入

    1: <script language=”JavaScript”>2: var userName = window.prompt(“Please Enter Your Name”,”Enter Your Name Here”);3: document.write(“Your Name is “ + userName);4: </script>

    57 打开一个新窗口

    1: //打开一个名称为myNewWindow的浏览器新窗口2: <script language=”JavaScript”>3: window.open(“http://www.liu21st.com/”,”myNewWindow”);4: </script>

    58 设置新窗口的大小

    1: <script language=”JavaScript”>2: window.open(“http://www.liu21st.com/”,”myNewWindow”,'height=300,width=300');3: </script>

    59 设置新窗口的位置

    1: <script language=”JavaScript”>2: window.open(“http://www.liu21st.com/”,”myNewWindow”,'height=300,width=300,left=200,screenX=200,top=100,screenY=100');3: </script>

    60 是否显示工具栏和滚动栏

    1: <script language=”JavaScript”>2: window.open(“http:

    61 是否可以缩放新窗口的大小

    1: <script language=”JavaScript”>2: window.open('http://www.liu21st.com/' , 'myNewWindow', 'resizable=yes' );</script>

    62 加载一个新的文档到当前窗口

    1: <a href='#' onClick='document.location = '125a.html';' >Open New Document</a>

    63 设置页面的滚动位置

    1: <script language=”JavaScript”>2: if (document.all) { //如果是IE浏览器则使用scrollTop属性3: document.body.scrollTop = 200;4: } else { //如果是NetScape浏览器则使用pageYOffset属性5: window.pageYOffset = 200;6: }</script>

    64 在IE中打开全屏窗口

    1: <a href='#' onClick=”window.open('http://www.juxta.com/','newWindow','fullScreen=yes');”>Open a full-screen window</a>

    65 新窗口和父窗口的操作

    1: <script language=”JavaScript”>2: //定义新窗口3: var newWindow = window.open(“128a.html”,”newWindow”);4: newWindow.close(); //在父窗口中关闭打开的新窗口5: </script>6: 在新窗口中关闭父窗口7: window.opener.close()

    66 往新窗口中写内容

    1: <script language=”JavaScript”>2: var newWindow = window.open(“”,”newWindow”);3: newWindow.document.open();4: newWindow.document.write(“This is a new window”);5: newWIndow.document.close();6: </script>

    67 加载页面到框架页面

    1: <frameset cols=”50%,*”>2: <frame name=”frame1” src="/”135a.html"”>3: <frame name=”frame2” src="/”about:blank"”>4: </frameset>5: 在frame1中加载frame2中的页面6: parent.frame2.document.location = “135b.html”;

    68 在框架页面之间共享脚本如果在frame1中html文件中有个脚本

    1: function doAlert() { 2: window.alert(“Frame 1 is loaded”);3: }

    那么在frame2中可以如此调用该方法

    1: <body onLoad=”parent.frame1.doAlert();”>2: This is frame 2.3: </body>

    69 数据公用可以在框架页面定义数据项,使得该数据可以被多个框架中的页面公用

    1: <script language=”JavaScript”>2: var persistentVariable = “This is a persistent value”;3: </script>4: <frameset cols=”50%,*”>5: <frame name=”frame1” src="/”138a.html"”>6: <frame name=”frame2” src="/”138b.html"”>7: </frameset>

    这样在frame1和frame2中都可以使用变量persistentVariable 70 框架代码库根据以上的一些思路,我们可以使用一个隐藏的框架页面来作为整个框架集的代码库

    1: <frameset cols=”0,50%,*”>2: <frame name=”codeFrame” src="/”140code.html"”>3: <frame name=”frame1” src="/”140a.html"”>4: <frame name=”frame2” src="/”140b.html"”>5: </frameset>

     


    最新回复(0)