JavaScript：正则表达式初体验

挥动正则表达式之剑，斩尽各种复杂的匹配问题。 @mystylecat

资源

书籍

正则表达式是编程语言中的一大利器，它能够大幅提高开发效率。这正是我们需要学习正则表达式的原因。首先，提供两本参考书

1.《精通正则表达式》
2.《正则表达式经典实例》

学习视频

如果觉得看书太难，没关系，先来个入门级的课程，尝尝鲜儿吧–慕课网|JavaScript深入浅出之正则表达式

常用正则表达式

就知道你们想走捷

lan

径

duo

，那也有得治。下面是最常用的JavaScript正则表达式，只需要

ctrl+c/ctrl+v

，就能应用到工作中啦，快点去匹配问题说拜拜！

常用字符

匹配中文字符
/[\u4e00-\u9fa5]/gm
匹配双字节字符
/[^\x00-\xff]/igm
匹配行尾行首空白
/(^\s*)|(\s*$)/
只能输入数字
/^\d+$/
只能输入n个数字
/^\d{n}$/
至少输入n个以上的数字
/^\d{n,}$/
只能输入m到n个数字
/^\d{m,n}$/
只能由英文字母组成
/^[a-z]+$/i
只能由大写英文字母组成
/^[A-Z]+$/
只能由英文和数字组成
/^[a-z0-9]+$/i
只能由英文，数字和下划线组成
/^\w+$/
----------

常用表单

匹配email地址
/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/
匹配url地址
/^https?:\/\/(([a-zA-Z0-9_-])+(\.)?)*(:\d+)?(\/((\.)?(\?)?=?&?[a-zA-Z0-9_-](\?)?)*)*$/i
匹配手机号码
/^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/
匹配身份证号
/^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/
匹配邮政编码
/^[1-9]\d{5}(?!\d)$/
匹配日期（YYYY-mm-dd）
/^[1-2][0-9][0-9][0-9]-[0-1]{0,1}[0-9]-[0-3]{0,1}[0-9]$/

----------

浏览器navigator.userAgent

从UA判断是否为IE浏览器
/msie (\d+\.\d+)/i
从UA判断是否为webkit浏览器
/webkit/i
从UA判断是否为chrome浏览器
/chrome\/(\d+\.\d+)/i
从UA判断是否为firefox浏览器
/firefox\/(\d+\.\d+)/i
从UA判断是否为opera浏览器
/opera(\/| )(\d+(\.\d+)?)(.+?(version\/(\d+(\.\d+)?)))?/i
从UA判断是否为safari浏览器
/(\d+\.\d)?(?:\.\d)?\s+safari\/?(\d+\.\d+)?/i
从UA判断是否为android浏览器
/android/i
从UA判断是否为ipad
/ipad/i
从UA判断是否为iphone
/iphone/i
从UA判断是否为Mac Os平台
/macintosh/i
从UA判断是否为windows平台
/windows/i
从UA判断是否为移动终端
/(nokia|iphone|android|ipad|motorola|^mot\-|softbank|foma|docomo|kddi|up\.browser|up\.link|htc|dopod|blazer|netfront|helio|hosin|huawei|novarra|CoolPad|webos|techfaith|palmsource|blackberry|alcatel|amoi|ktouch|nexian|samsung|^sam\-|s[cg]h|^lge|ericsson|philips|sagem|wellcom|bunjalloo|maui|symbian|smartphone|midp|wap|phone|windows ce|iemobile|^spice|^bird|^zte\-|longcos|pantech|gionee|^sie\-|portalmmm|jig\s browser|hiptop|^ucweb|^benq|haier|^lct|opera\s*mobi|opera\*mini|320x320|240x320|176x220)/i

----------

html相关

匹配link标签
/\<link\s(.*?)\s*(([^&]>)|(\/\>)|(\<\/link\>))/gi
匹配html标签
/<(\S*?) [^>]*>.*?</\1>|<.*?/>/gm
匹配非html标签
/^[^<>`~!/@\#}$%:;)(_^{&*=|'+]+$/
匹配script标签
/<script[^>]*>[\s\S]*?<\/[^>]*script>/gi
匹配html注释
/<!--[\s\S]*?--\>/g
匹配html条件注释
/\[\s*if\s+[^\]][\s\w]*\]/i
匹配非IE的条件注释
/^\[if\s+(!IE|false)\]>.*<!\[endif\]$/i
匹配css expression
/expression[\s\r\n ]?\(/gi
匹配不合法的html标签
/<\W+>/gi
匹配textarea标签
/<textarea[^>]*>[\s\S]*?<\/[^>]*textarea>/gi

如果阅读到了这里，那么恭喜你，马上就要get一个新技能了。快点下载QQ浏览器，体验一下

web前端助手

吧。


虽然我不是什么大牛，但却愿意在前端道路上走到黑，共勉。到这里，你以为正则表达式就结束了？悄悄告诉你，本系列会继续写下去的~~~ @mystylecat

好文推荐：FE Alien的笔记Javascript正则表达式