复习字符串操作:
search 查找
substring 获取子字符串
charAt 获取某个字符
split 分割字符串, 获取数组
- var str = 'abcdefghijk';
- alert(str.search('b')); // 返回 1, 表示 b 在字符串中的位置是 1, 不存在的字符返回 - 1
- alert(str.substring(2,5)); // 包含开头不包含结尾, 所以返回 cde
- alert(str.substring(3)); // 返回 defghijk
- alert(str.charAt(3)); //d
- alert(str.split('')); // 返回"a,b,c,d,e,f,g,h,i,j,k"
找出字符串中的所有数字
用传统字符串操作完成
- // 找出 str1 中的所有数字
- var str1 = '12 sfdg-=/*sfgh85gdhj8745';
- var arr = [];
- var tmp = '';
- for (var i = 0; i <str1.length; i++) {
- if (str1.charAt(i)>= '0' && str1.charAt(i) <= 9) {
- tmp+=str1.charAt(i);
- } else {
- if (tmp){
- arr.push(tmp);
- tmp = '';
- }
- }
- }
- if (tmp){
- arr.push(tmp);
- tmp = '';
- }
- alert(arr); // 返回 12,85,8745
用正则表达式完成
- var str1 = '12 sfdg-=/*sfgh85gdhj8745';
- alert(str1.match(/\d+/g)); // 返回 12,85,8745, 其中 \ d 表示实数, g=global(全局, 全部)
什么是正则表达式:
什么是正则: 其实就是一种规则或模式, 比如说邮箱的表示规则是:"一串英文, 数字和下划线组合 @一串英文数字组合. 一串英文"
正则表达是也是一种, 强大的字符串匹配工具, 是一种正常人类很难读懂的文字
RegExp 对象
JS 风格 --new RegExp('a', 'i');
perl 风格 --/a/i
字符串与正则表达式:
search: 字符串搜索
返回出现的位置
忽略大小写: i--ignore
判断浏览器类型
- // var re = new RegExp('a', 'i'); // 最简单的正则表达式, 什么也不表示, 就表示一个 "a" 本身, JS 风格的写法, 其中 i=ignore 表示忽略大小写
- var re = /a/i; // 另一种写法, 意义与上句相同, 是一种 perl 风格的写法, 其中 i=ignore 表示忽略大小写
- var str = 'abcdef';
- alert(str.search(re)); // 返回 "0", 表示 a 在字符串的第 0 位
match: 获取匹配的项目
量词: 表示个数, 即被求项目的个数;
+: 表示若干
量词变化:\d,\d\d 和 \ d+
全局匹配: g--global
例子: 找出所有数字
- // 找第一个数字出现的位置,
- var str = 'abf ,=-1sdf65';
- var re = /\d/g; // 其中 \ d 表示数字, g=global, 找到全部
- alert(str.match(re)); // 返回 1,6,5
- var re1 = /\d+/g; // 所以上面不带加号, 表示一个数字一个数字获取的, 而现在是一串数字一串数字获取的
- alert(str.match(re1)); // 返回 1,65
- replace
替换所有匹配
返回替换后的字符串
- //replace 的使用
- var str = 'alghqaerghjcvbagc';
- // alert(str.replace('a','0')); // 返回 0lghqaerghjcvbagc, 可见该句只把字符串中的第一个 a 替换成了 0,qita 没变
- // 当我们用正则表达式时:
- // var re = /a/;
- // alert(str.replace(re, '0')); // 返回 0lghqaerghjcvbagc, 与上面一样
- var re = /a/g;
- alert(str.replace(re, '0')); // 返回 0lghq0erghjcvb0gc, 此时 a 全部被替换成 0
例子: 敏感词过滤
- <!DOCTYPE html>
- <HTML lang="en">
- <head>
- <meta charset="UTF-8">
- <title>
- 敏感词过滤
- </title>
- <script>
- Windows.onload = function() {
- var oTxt1 = document.getElementById('txt1');
- var oTxt2 = document.getElementById('txt2');
- var oBtn = document.getElementById('btn1');
- oBtn.onclick = function() {
- var re = /a|g|j|d|S/gi; // 把 agjS 作为敏感词过滤掉, g 表示全部, i 表示忽略大小写, gi 或 ig 不影响
- oTxt2.value = oTxt1.value.replace(re, '***');
- };
- };
- </script>
- </head>
- <body>
- <textarea id="txt1" rows="10" cols="40">
- </textarea>
- <br>
- <button id="btn1">
- 过滤
- </button>
- <br>
- <textarea id="txt2" rows="10" cols="40">
- </textarea>
- </body>
- </HTML>
View Code
字符串:[]在正则表达式中被称作元字符, 具有以下功能
任意字符:
[abc]: 表示 "或"-- 任选的意思, 即任选一个 "[]" 内的字母, 例子: o[usb]t--ost,obt,out
范围:
[a-z],[0-9](相当于 \ d)例子: id[0-9]--id0,id5
排除:
[^a](除了 a 以外的其他字符)例子: o[^0-9]t--oat,o?t,o t(除了数字之外),[^a-z0-9](除了英文和数字)
组合:
[a-z0-9A-Z]
实例: 采集小说, 说白了就是偷小说, 在原来网站上打开某个小说, 然后查看打开网页的源码, 然后把文字复制出来. 然后再把文本里面掺杂的 HTML 标签过滤掉, 下面是实现方法
自定义 innerText 方法
- <!DOCTYPE HTML>
- <HTML lang="en">
- <head>
- <meta charset="UTF-8">
- <title>
- 采集网页小说
- </title>
- <script>
- Windows.onload = function() {
- var oTxt1 = document.getElementById('txt1');
- var oTxt2 = document.getElementById('txt2');
- var oBtn = document.getElementById('btn1');
- oBtn.onclick = function() {
- var re = /<[^<>]+>/g; //<内部除了 "<>" 外的所有字符 +>
- oTxt2.value = oTxt1.value.replace(re, '');
- };
- };
- </script>
- </head>
- <body>
- <textarea id="txt1" rows="10" cols="100">
- </textarea>
- <br>
- <button id="btn1">
- 过滤
- </button>
- <br>
- <textarea id="txt2" rows="10" cols="100">
- </textarea>
- </body>
- </HTML>
View Code
转义字符:
.(点: 通配符, 表示任意字符): 尽量少用或不用, 因为容易出错
- \d(数字, 即 0-9--[0-9])
- \w(英文, 数字和下划线 --[a-z0-9_])
- \s(空白字符: 空格, Tab 等)
- \D(除了数字 --[^0-9])
- \W(除了英文, 数字和下划线 --[^a-z0-9_])
- \S(除了空白字符: 空格, Tab 等)
量词: 其实就是指某个值出现的次数
常用量词:
{n,m}, 至少出现 n 次, 最多 m 次
{n,} 至少 n 次
* 任意次, 相当于{0,}, 不建议使用, 经常出错, 所以几乎用不到
? 0 次或一次, 即可有可无, 等价于{0,1}
+ 一次或任意次, 即至少一次, 等价于{1,}
{n} 正好出现 n 次
例子: 查找 QQ 号(目前 QQ 号大多是为 5-11 为, 且第一个数字不能为 0), 则有:[1-9]\d{4,10}
- <script>
- Windows.onload = function () {
- var oTxt = document.getElementById('txt1');
- var oBtn = document.getElementById('btn1');
- oBtn.onclick = function () {
- var txt = oTxt.value;
- var re = /^[1-9]\d{4,10}$/;
- if (txt.match(re)) {
- alert("这串数字符合 QQ 号的规则!");
- } else {
- alert("这串数字不符合 QQ 号的规则!");
- }
- };
- };
- </script>
- <body>
- <input id="txt1" type="text"/>
- <button id="btn1">检查一串数字是否符合 QQ 号的规则</button>
- </body>
再如: 固定电话的号码: 区号(第一位为 0, 共 3-4 为)(区号可有可无)- 号码(一般为 8 为, 首位不能为 0)- 分机号(一般不超过 5 位, 可有可无), 则有:(0\d{2,3}-)?[1-9]\d{7}(-\d{1,5})?
常用正则例子: 邮箱 (一串英文, 数字和下划线组合 @一串英文数字组合. 一串英文) 校验 --(\w+@[a-z0-9]+\.[a-z]-- 其中 "\." 表示对 "." 的转义, 因为 "." 在正则表达式中有特殊含义)
行首: 字符串的开头, 在正则表达式中用 "^" 表示行首
行尾: 字符串的结尾, 在正则表达式中用 "$" 表示行尾
- <!DOCTYPE HTML>
- <HTML lang="en">
- <head>
- <meta charset="UTF-8">
- <title>
- 邮箱校验
- </title>
- <script>
- Windows.onload = function() {
- var oTxt = document.getElementById('txt1');
- var oBtn = document.getElementById('btn1');
- oBtn.onclick = function() {
- var re = /^\w+@[a-z0-9]+\.[a-z]+$/i;
- if (re.test(oTxt.value)) { // 正则自带测试匹配的函数 test
- alert("是合法邮箱!");
- } else {
- alert("邮箱不合法!");
- }
- };
- };
- // 但是 test()有一个小问题: 只要字符串的部分符合要求, 它就返回 true, 所以我们要把行首和行尾封住,
- // 如 "/^\w+@[a-z0-9]+\.[a-z]+$/i", 意思就是说, 只有和行首和行尾中间的东西匹配成功, 才表示匹配成功
- </script>
- </head>
- <body>
- <input id="txt1" type="text" />
- <button id="btn1">
- 邮箱校验
- </button>
- </body>
- </HTML>
View Code
来源: http://www.bubuko.com/infodetail-2968996.html