正则、本地存储

正则表达式

1、什么是正则表达式: 
能让计算机读懂的字符串匹配规则。

2、正则表达式的写法:
var re=new RegExp('规则', '可选参数');
var re=/规则/参数;

3、规则中的字符 
1)普通字符匹配:
如:/a/ 匹配字符 ‘a’,/a,b/ 匹配字符 ‘a,b’

2)转义字符匹配:
\d 匹配一个数字,即0-9
\D 匹配一个非数字,即除了0-9
\w 匹配一个单词字符(字母、数字、下划线)
\W 匹配任何非单词字符。等价于[^A-Za-z0-9_]
\s 匹配一个空白符
\S 匹配一个非空白符
\b 匹配单词边界
\B 匹配非单词边界
. 匹配一个任意字符,除了换行符‘\n’和回车符‘\r’
\1 重复子项

4、量词:对左边的匹配字符定义个数 
? 出现零次或一次(最多出现一次)
+ 出现一次或多次(至少出现一次)
* 出现零次或多次(任意次)
{n} 出现n次
{n,m} 出现n到m次
{n,} 至少出现n次

5、任意一个或者范围 
[abc123] : 匹配‘abc123’中的任意一个字符
[a-z0-9] : 匹配a到z或者0到9中的任意一个字符

6、限制开头结尾 
^ 以紧挨的元素开头
$ 以紧挨的元素结尾

正则

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>正则</title>
    <style type="text/css">
        
    </style>
    <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
    <script type="text/javascript">
        //校验QQ
        /*
        //JS的方式比较麻烦
        function checkQQ(qq){
            var flag = true;//默认符合要求
            if(qq.length>=5 && qq.length<=15){
                if(qq.indexOf("0")){
                    if(isNaN(qq)){
                        flag = false;//不是数字
                    }
                }else{
                    flag = false;//以0开头,不符合QQ标准
                }
            }else{
                flag = false;//长度不符合
            }
            return flag;
        }

        console.log(checkQQ("012345"));
        console.log(checkQQ("a12b345"));
        console.log(checkQQ("123456"));//true
        console.log(checkQQ("1234567890987654321"));
        */

        //正则匹配简单高效
        var regex = /^[1-9]\d{4,14}$/;
        
        console.log(regex.test("012345"));
        console.log(regex.test("a12b345"));
        console.log(regex.test("123456"));//true
        console.log(regex.test("1234567890987654321"));
    </script>
</head>
<body>
    
</body>
</html>

正则表达式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>正则表达式</title>
    <style type="text/css">
        
    </style>
    <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
    <script type="text/javascript">
        //匹配字母a,i表示忽略大小写,g表示全文检索
        var re = new RegExp('a', 'ig');
        var re2 = /a/ig;

        var str = 'abc';
        //调用test方法进行匹配,匹配成功返回true,否则返回false
        // alert(re2.test(str));//true

        //匹配字母ac,忽略大小写,全文检索
        re2 = /ac/ig;
        // alert(re2.test(str));//false

        //匹配数字
        var re3 = /\d/;
        var str3 = '123';
        // alert(re3.test(str3));//true

        str3 = '123ab1';
        // alert(re3.test(str3));//true

        //匹配数字,全文检索
        re3 = /\d/g;
        // alert(re3.test(str3));//true

        //匹配数字开头并结尾
        re3 = /^\d$/;
        // alert(re3.test(str3));//false

        //匹配从开头到结尾有一个或多个数字
        re3 = /^\d+$/;
        // alert(re3.test(str3));//false

        //匹配数字、字母、下划线
        var re4 = /\w/;
        var str4 = '@asd';
        // alert(re4.test(str4));//true

        //匹配数字、字母、下划线开头
        re4 = /^\w/;
        // alert(re4.test(str4));//false

        str4 = 'as&d';
        // alert(re4.test(str4));//true

        //匹配从开头到结尾有一个或多个数字、字母、下划线
        re4 = /^\w+$/;
        // alert(re4.test(str4));//false

        var str5 = '123adfas894fasdfas15122dfad85';
        var re5 = /\d+/g;//全文检索一个或多个数字
        var arr = str5.match(re5);
        // alert(arr);//123,894,15122,85

        var re6 = /d/;//匹配字母d
        // alert(str5.search(re6));//4//search相当于indexOf()函数

        //replace函数用于替换
        var str6 = str5.replace(re5, '*');
        // alert(str6);//*adfas*fasdfas*dfad*

        //正则表达式的替换功能
        var s = "Once111a22wolf,3always4a5wolf!";
        var regex = /\d+/g;
        var s2 = s.replace(regex, " ");
        // console.log(s2);

        /*叠词*/
        //快快乐乐、高高兴兴
        regex = /(.)\1(.)\2/;//()表示分组,.表示任意字符,匹配第一组任意字符再出现一次、第二组任意字符再出现一次
        // console.log(regex.test("快快乐乐"));//true
        // console.log(regex.test("快乐乐乐"));
        // console.log(regex.test("高高兴兴"));//true
        // console.log(regex.test("快乐快乐"));

        //快乐快乐、高兴高兴
        regex = /(..)\1/;//匹配两个任意字符再出现一次
        // console.log(regex.test("快乐快乐"));//true
        // console.log(regex.test("高兴高兴"));//true
        // console.log(regex.test("快快快快"));//true
        // console.log(regex.test("快快乐乐"));

        //叠词切割
        // s = 'sdqqfgkkkhjppppkl';
        // regex = /(.)\1+/;
        // var arr = s.split(regex);
        // console.log(arr);//由于()中的是子表达式,会导致保留一个叠词字母,不符合要求

        s = 'sdqqfgkkkhjppppkl';
        regex = /(.)\1+/g;//匹配叠词,即多个重复的字母
        var s2 = s.replace(regex, " ");//将叠词替换为空格
        var arr = s2.split(' ');//再按照空格进行切割
        // console.log(arr);//返回["sd","fg","hj","kl"],符合要求

        //字符串替换
        var s = "我我....我...我.要...要要...要学....学学..学.编..编编.编.程.程.程..程";
        var s2 = s.replace(/\.+/g, "");//删除所有的点
        // console.log(s2);
        var s3 = s2.replace(/(.)\1+/g, "$1");//全文检索叠词,替换为单个字符,例如多个“我”替换成一个“我”
        // console.log(s3);

        //提取手机号
        //regex = /^1[3578]\d{9}$/;手机号的正则,只能匹配17688888888
        var s = '我的手机号码是17688888888,曾经用过13187654321,还用过13512345678';
        var regex = /1[3578]\d{9}/g;//第一位是1,第二位是3578中的一个,后面9位是任意数字,并全文检索
        var arr = s.match(regex);//match方法返回匹配成功的数组
        console.log(arr);//["17688888888","13187654321","13512345678"]
    </script>
</head>
<body>
    
</body>
</html>

本地存储

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>cookie</title>
    <style type="text/css">
        
    </style>
    <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
    <script type="text/javascript" src="js/jquery.cookie.js"></script>
    <script type="text/javascript">
        //cookie的读和写需要在服务器环境下
        
        //写cookie
        //参数:名称、值、有效期几天、路径
        $.cookie('mycookie','ok!',{expires:7,path:'/'});

        //读cookie
        var val = $.cookie('mycookie');
        alert(val);//ok!
    </script>
</head>
<body>
    
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>本地存储</title>
    <style type="text/css">
        
    </style>
    <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
    <script type="text/javascript">
        //写入
        //[{"id":1,"num":2,....},{}..]
        localStorage.setItem('mystorage','ok!');

        //读取
        alert(localStorage.mystorage);//ok!

        //写入
        // sessionStorage.setItem('name','tom');

        //读取
        alert(sessionStorage.name);//tom//没有弹undefined


        localStorage.setItem('mystorage','{"goods":["1","2"]}');
    </script>
</head>
<body>
    
</body>
</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 224,896评论 6 522
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 96,283评论 3 402
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 172,085评论 0 367
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 61,010评论 1 300
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 70,015评论 6 400
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 53,492评论 1 314
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 41,858评论 3 428
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 40,829评论 0 279
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 47,374评论 1 324
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 39,409评论 3 346
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 41,527评论 1 355
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 37,131评论 5 351
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 42,858评论 3 339
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 33,296评论 0 25
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 34,434评论 1 276
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 50,087评论 3 381
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 46,597评论 2 366