JavaScript正则实战

*:first-child {
margin-top: 0 !important;
}

.markdown-body>*:last-child {
margin-bottom: 0 !important;
}

.markdown-body .headeranchor-link {
position: absolute;
top: 0;
bottom: 0;
left: 0;
display: block;
padding-right: 6px;
padding-left: 30px;
margin-left: -30px;
}

.markdown-body .headeranchor-link:focus {
outline: none;
}

.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4,
.markdown-body h5,
.markdown-body h6 {
position: relative;
margin-top: 1em;
margin-bottom: 16px;
font-weight: bold;
line-height: 1.4;
}

.markdown-body h1 .headeranchor,
.markdown-body h2 .headeranchor,
.markdown-body h3 .headeranchor,
.markdown-body h4 .headeranchor,
.markdown-body h5 .headeranchor,
.markdown-body h6 .headeranchor {
display: none;
color: #000;
vertical-align: middle;
}

.markdown-body h1:hover .headeranchor-link,
.markdown-body h2:hover .headeranchor-link,
.markdown-body h3:hover .headeranchor-link,
.markdown-body h4:hover .headeranchor-link,
.markdown-body h5:hover .headeranchor-link,
.markdown-body h6:hover .headeranchor-link {
height: 1em;
padding-left: 8px;
margin-left: -30px;
line-height: 1;
text-decoration: none;
}

.markdown-body h1:hover .headeranchor-link .headeranchor,
.markdown-body h2:hover .headeranchor-link .headeranchor,
.markdown-body h3:hover .headeranchor-link .headeranchor,
.markdown-body h4:hover .headeranchor-link .headeranchor,
.markdown-body h5:hover .headeranchor-link .headeranchor,
.markdown-body h6:hover .headeranchor-link .headeranchor {
display: inline-block;
}

.markdown-body h1 {
padding-bottom: 0.3em;
font-size: 2.25em;
line-height: 1.2;
border-bottom: 1px solid #eee;
}

.markdown-body h2 {
padding-bottom: 0.3em;
font-size: 1.75em;
line-height: 1.225;
border-bottom: 1px solid #eee;
}

.markdown-body h3 {
font-size: 1.5em;
line-height: 1.43;
}

.markdown-body h4 {
font-size: 1.25em;
}

.markdown-body h5 {
font-size: 1em;
}

.markdown-body h6 {
font-size: 1em;
color: #777;
}

.markdown-body p,
.markdown-body blockquote,
.markdown-body ul,
.markdown-body ol,
.markdown-body dl,
.markdown-body table,
.markdown-body pre,
.markdown-body .admonition {
margin-top: 0;
margin-bottom: 16px;
}

.markdown-body hr {
height: 4px;
padding: 0;
margin: 16px 0;
background-color: #e7e7e7;
border: 0 none;
}

.markdown-body ul,
.markdown-body ol {
padding-left: 2em;
}

.markdown-body ul ul,
.markdown-body ul ol,
.markdown-body ol ol,
.markdown-body ol ul {
margin-top: 0;
margin-bottom: 0;
}

.markdown-body li>p {
margin-top: 16px;
}

.markdown-body dl {
padding: 0;
}

.markdown-body dl dt {
padding: 0;
margin-top: 16px;
font-size: 1em;
font-style: italic;
font-weight: bold;
}

.markdown-body dl dd {
padding: 0 16px;
margin-bottom: 16px;
}

.markdown-body blockquote {
padding: 0 15px;
color: #777;
border-left: 4px solid #ddd;
}

.markdown-body blockquote>:first-child {
margin-top: 0;
}

.markdown-body blockquote>:last-child {
margin-bottom: 0;
}

.markdown-body table {
display: block;
width: 100%;
overflow: auto;
word-break: normal;
word-break: keep-all;
}

.markdown-body table th {
font-weight: bold;
}

.markdown-body table th,
.markdown-body table td {
padding: 6px 13px;
border: 1px solid #ddd;
}

.markdown-body table tr {
background-color: #fff;
border-top: 1px solid #ccc;
}

.markdown-body table tr:nth-child(2n) {
background-color: #f8f8f8;
}

.markdown-body img {
max-width: 100%;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.markdown-body code,
.markdown-body samp {
padding: 0;
padding-top: 0.2em;
padding-bottom: 0.2em;
margin: 0;
font-size: 85%;
background-color: rgba(0,0,0,0.04);
border-radius: 3px;
}

.markdown-body code:before,
.markdown-body code:after {
letter-spacing: -0.2em;
content: "\00a0";
}

.markdown-body pre>code {
padding: 0;
margin: 0;
font-size: 100%;
word-break: normal;
white-space: pre;
background: transparent;
border: 0;
}

.markdown-body .codehilite {
margin-bottom: 16px;
}

.markdown-body .codehilite pre,
.markdown-body pre {
padding: 16px;
overflow: auto;
font-size: 85%;
line-height: 1.45;
background-color: #f7f7f7;
border-radius: 3px;
}

.markdown-body .codehilite pre {
margin-bottom: 0;
word-break: normal;
}

.markdown-body pre {
word-wrap: normal;
}

.markdown-body pre code {
display: inline;
max-width: initial;
padding: 0;
margin: 0;
overflow: initial;
line-height: inherit;
word-wrap: normal;
background-color: transparent;
border: 0;
}

.markdown-body pre code:before,
.markdown-body pre code:after {
content: normal;
}

/* Admonition */
.markdown-body .admonition {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
position: relative;
border-radius: 3px;
border: 1px solid #e0e0e0;
border-left: 6px solid #333;
padding: 10px 10px 10px 30px;
}

.markdown-body .admonition table {
color: #333;
}

.markdown-body .admonition p {
padding: 0;
}

.markdown-body .admonition-title {
font-weight: bold;
margin: 0;
}

.markdown-body .admonition>.admonition-title {
color: #333;
}

.markdown-body .attention>.admonition-title {
color: #a6d796;
}

.markdown-body .caution>.admonition-title {
color: #d7a796;
}

.markdown-body .hint>.admonition-title {
color: #96c6d7;
}

.markdown-body .danger>.admonition-title {
color: #c25f77;
}

.markdown-body .question>.admonition-title {
color: #96a6d7;
}

.markdown-body .note>.admonition-title {
color: #d7c896;
}

.markdown-body .admonition:before,
.markdown-body .attention:before,
.markdown-body .caution:before,
.markdown-body .hint:before,
.markdown-body .danger:before,
.markdown-body .question:before,
.markdown-body .note:before {
font: normal normal 16px fontawesome-mini;
-moz-osx-font-smoothing: grayscale;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
line-height: 1.5;
color: #333;
position: absolute;
left: 0;
top: 0;
padding-top: 10px;
padding-left: 10px;
}

.markdown-body .admonition:before {
content: "\f056\00a0";
color: 333;
}

.markdown-body .attention:before {
content: "\f058\00a0";
color: #a6d796;
}

.markdown-body .caution:before {
content: "\f06a\00a0";
color: #d7a796;
}

.markdown-body .hint:before {
content: "\f05a\00a0";
color: #96c6d7;
}

.markdown-body .danger:before {
content: "\f057\00a0";
color: #c25f77;
}

.markdown-body .question:before {
content: "\f059\00a0";
color: #96a6d7;
}

.markdown-body .note:before {
content: "\f040\00a0";
color: #d7c896;
}

.markdown-body .admonition::after {
content: normal;
}

.markdown-body .attention {
border-left: 6px solid #a6d796;
}

.markdown-body .caution {
border-left: 6px solid #d7a796;
}

.markdown-body .hint {
border-left: 6px solid #96c6d7;
}

.markdown-body .danger {
border-left: 6px solid #c25f77;
}

.markdown-body .question {
border-left: 6px solid #96a6d7;
}

.markdown-body .note {
border-left: 6px solid #d7c896;
}

.markdown-body .admonition>*:first-child {
margin-top: 0 !important;
}

.markdown-body .admonition>*:last-child {
margin-bottom: 0 !important;
}

/* progress bar*/
.markdown-body .progress {
display: block;
width: 300px;
margin: 10px 0;
height: 24px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color: #ededed;
position: relative;
box-shadow: inset -1px 1px 3px rgba(0, 0, 0, .1);
}

.markdown-body .progress-label {
position: absolute;
text-align: center;
font-weight: bold;
width: 100%; margin: 0;
line-height: 24px;
color: #333;
text-shadow: 1px 1px 0 #fefefe, -1px -1px 0 #fefefe, -1px 1px 0 #fefefe, 1px -1px 0 #fefefe, 0 1px 0 #fefefe, 0 -1px 0 #fefefe, 1px 0 0 #fefefe, -1px 0 0 #fefefe, 1px 1px 2px #000;
-webkit-font-smoothing: antialiased !important;
white-space: nowrap;
overflow: hidden;
}

.markdown-body .progress-bar {
height: 24px;
float: left;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color: #96c6d7;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -1px 0 rgba(0, 0, 0, .1);
background-size: 30px 30px;
background-image: -webkit-linear-gradient(
135deg, rgba(255, 255, 255, .4) 27%,
transparent 27%,
transparent 52%, rgba(255, 255, 255, .4) 52%,
rgba(255, 255, 255, .4) 77%,
transparent 77%, transparent
);
background-image: -moz-linear-gradient(
135deg,
rgba(255, 255, 255, .4) 27%, transparent 27%,
transparent 52%, rgba(255, 255, 255, .4) 52%,
rgba(255, 255, 255, .4) 77%, transparent 77%,
transparent
);
background-image: -ms-linear-gradient(
135deg,
rgba(255, 255, 255, .4) 27%, transparent 27%,
transparent 52%, rgba(255, 255, 255, .4) 52%,
rgba(255, 255, 255, .4) 77%, transparent 77%,
transparent
);
background-image: -o-linear-gradient(
135deg,
rgba(255, 255, 255, .4) 27%, transparent 27%,
transparent 52%, rgba(255, 255, 255, .4) 52%,
rgba(255, 255, 255, .4) 77%, transparent 77%,
transparent
);
background-image: linear-gradient(
135deg,
rgba(255, 255, 255, .4) 27%, transparent 27%,
transparent 52%, rgba(255, 255, 255, .4) 52%,
rgba(255, 255, 255, .4) 77%, transparent 77%,
transparent
);
}

.markdown-body .progress-100plus .progress-bar {
background-color: #a6d796;
}

.markdown-body .progress-80plus .progress-bar {
background-color: #c6d796;
}

.markdown-body .progress-60plus .progress-bar {
background-color: #d7c896;
}

.markdown-body .progress-40plus .progress-bar {
background-color: #d7a796;
}

.markdown-body .progress-20plus .progress-bar {
background-color: #d796a6;
}

.markdown-body .progress-0plus .progress-bar {
background-color: #c25f77;
}

.markdown-body .candystripe-animate .progress-bar{
-webkit-animation: animate-stripes 3s linear infinite;
-moz-animation: animate-stripes 3s linear infinite;
animation: animate-stripes 3s linear infinite;
}

@-webkit-keyframes animate-stripes {
0% {
background-position: 0 0;
}

100% {
background-position: 60px 0;
}
}

@-moz-keyframes animate-stripes {
0% {
background-position: 0 0;
}

100% {
background-position: 60px 0;
}
}

@keyframes animate-stripes {
0% {
background-position: 0 0;
}

100% {
background-position: 60px 0;
}
}

.markdown-body .gloss .progress-bar {
box-shadow:
inset 0 4px 12px rgba(255, 255, 255, .7),
inset 0 -12px 0 rgba(0, 0, 0, .05);
}

/* Multimarkdown Critic Blocks */
.markdown-body .critic_mark {
background: #ff0;
}

.markdown-body .critic_delete {
color: #c82829;
text-decoration: line-through;
}

.markdown-body .critic_insert {
color: #718c00 ;
text-decoration: underline;
}

.markdown-body .critic_comment {
color: #8e908c;
font-style: italic;
}

.markdown-body .headeranchor {
font: normal normal 16px octicons-anchor;
line-height: 1;
display: inline-block;
text-decoration: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

.headeranchor:before {
content: '\f05c';
}

.markdown-body .task-list-item {
list-style-type: none;
}

.markdown-body .task-list-item+.task-list-item {
margin-top: 3px;
}

.markdown-body .task-list-item input {
margin: 0 4px 0.25em -20px;
vertical-align: middle;
}

/* Media */
@media only screen and (min-width: 480px) {
.markdown-body {
font-size:14px;
}
}

@media only screen and (min-width: 768px) {
.markdown-body {
font-size:16px;
}
}

@media print {
.markdown-body * {
background: transparent !important;
color: black !important;
filter:none !important;
-ms-filter: none !important;
}

.markdown-body {
font-size:12pt;
max-width:100%;
outline:none;
border: 0;
}

.markdown-body a,
.markdown-body a:visited {
text-decoration: underline;
}

.markdown-body .headeranchor-link {
display: none;
}

.markdown-body a[href]:after {
content: " (" attr(href) ")";
}

.markdown-body abbr[title]:after {
content: " (" attr(title) ")";
}

.markdown-body .ir a:after,
.markdown-body a[href^="javascript:"]:after,
.markdown-body a[href^="#"]:after {
content: "";
}

.markdown-body pre {
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word;
}

.markdown-body pre,
.markdown-body blockquote {
border: 1px solid #999;
padding-right: 1em;
page-break-inside: avoid;
}

.markdown-body .progress,
.markdown-body .progress-bar {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}

.markdown-body .progress {
border: 1px solid #ddd;
}

.markdown-body .progress-bar {
height: 22px;
border-right: 1px solid #ddd;
}

.markdown-body tr,
.markdown-body img {
page-break-inside: avoid;
}

.markdown-body img {
max-width: 100% !important;
}

.markdown-body p,
.markdown-body h2,
.markdown-body h3 {
orphans: 3;
widows: 3;
}

.markdown-body h2,
.markdown-body h3 {
page-break-after: avoid;
}
}
-->

1. javascript 正则对象替换创建和用法：/pattern/flags 先简单案例学习认识下replace能干什么

正则表达式构造函数： new RegExp(“pattern”[,”flags”]);
正则表达式替换变量函数：stringObj.replace(RegExp,replace Text);

参数说明：
pattern – 一个正则表达式文本
flags – 如果存在，将是以下值：
g: 全局匹配
i: 忽略大小写
gi: 以上组合

//下面的例子用来获取url的两个参数，并返回urlRewrite之前的真实Url

var reg = new RegExp("(http://www.qidian.com/BookReader/)(\\d+),(\\d+).aspx", "gmi");

var url = "http://www.qidian.com/BookReader/1017141,20361055.aspx";

//方式一,最简单常用的方式

var rep = url.replace(reg, "$1ShowBook.aspx?bookId=$2&chapterId=$3");

alert(rep);

//方式二 ,采用固定参数的回调函数

var rep2 = url.replace(reg, function(m, p1, p2, p3) {

    return p1 + "ShowBook.aspx?bookId=" + p3 + "&chapterId=" + p3

});

alert(rep2);

//方式三，采用非固定参数的回调函数

var rep3 = url.replace(reg, function() {

    var args = arguments;

    return args[1] + "ShowBook.aspx?bookId=" + args[2] + "&chapterId=" + args[3];

});

alert(rep3);

//方法四

//方式四和方法三很类似, 除了返回替换后的字符串外，还可以单独获取参数

var bookId;

var chapterId;

function capText() {

    var args = arguments;

    bookId = args[2];

    chapterId = args[3];

    return args[1] + "ShowBook.aspx?bookId=" + args[2] + "&chapterId=" + args[3];

}

var rep4 = url.replace(reg, capText);

alert(rep4);

alert(bookId);

alert(chapterId);

//使用test方法获取分组

var reg3 = new RegExp("(http://www.qidian.com/BookReader/)(\\d+),(\\d+).aspx", "gmi");

reg3.test("http://www.qidian.com/BookReader/1017141,20361055.aspx");

//获取三个分组

alert(RegExp.$1);

alert(RegExp.$2);

alert(RegExp.$3);

2. 学习最常用的 test exec match search replace split 6个方法

① test 检查指定的字符串是否存在

var data = “123123″;

var reCat = /123/gi;

alert(reCat.test(data));  //true

//检查字符是否存在  g 继续往下走  i 不区分大小写

② exec 返回查询值

var data = “123123,213,12312,312,3,Cat,cat,dsfsdfs,”;

var reCat = /cat/i;

alert(reCat.exec(data));  //Cat

③ match 得到查询数组

var data = “123123,213,12312,312,3,Cat,cat,dsfsdfs,”;

var reCat = /cat/gi;

var arrMactches = data.match(reCat)

for (var i=0;i < arrMactches.length ; i++){

    alert(arrMactches[i]);   //Cat  cat

}

④ search 返回搜索位置,类似于indexof

var data = “123123,213,12312,312,3,Cat,cat,dsfsdfs,”;

var reCat = /cat/gi;

alert(data.search(reCat));  //23

⑤ replace 替换字符,利用正则替换

var data = “123123,213,12312,312,3,Cat,cat,dsfsdfs,”;

var reCat = /cat/gi;

alert(data.replace(reCat,”libinqq”));

⑥ split 利用正则分割数组

var data = “123123,213,12312,312,3,Cat,cat,dsfsdfs,”;

var reCat = /\,/;

var arrdata = data.split(reCat);

for (var i = 0; i < arrdata.length; i++){

    alert(arrdata[i]);

}

3. 常用表达式收集：

"^\\d+$"//非负整数（正整数+0）

"^[0-9]*[1-9][0-9]*$"//正整数

"^((-\\d+)|(0+))$"//非正整数（负整数+0）

"^-[0-9]*[1-9][0-9]*$"//负整数

"^-?\\d+$"//整数

"^\\d+(\\.\\d+)?$"//非负浮点数（正浮点数+0）

"^(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*))$"//正浮点数

"^((-\\d+(\\.\\d+)?)|(0+(\\.0+)?))$"//非正浮点数（负浮点数+0）

"^(-(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*)))$"//负浮点数

"^(-?\\d+)(\\.\\d+)?$"//浮点数

"^[A-Za-z]+$"//由26个英文字母组成的字符串

"^[A-Z]+$"//由26个英文字母的大写组成的字符串

"^[a-z]+$"//由26个英文字母的小写组成的字符串

"^[A-Za-z0-9]+$"//由数字和26个英文字母组成的字符串

"^\\w+$"//由数字、26个英文字母或者下划线组成的字符串

"^[\\w-]+(\\.[\\w-]+)*@[\\w-]+(\\.[\\w-]+)+$"//email地址

"^[a-zA-z]+://(\\w+(-\\w+)*)(\\.(\\w+(-\\w+)*))*(\\?\\S*)?$"//url

"^[A-Za-z0-9_]*$"。

4. 正则表达式基础知识

^匹配一个输入或一行的开头，/^a/匹配"an A"，而不匹配"An a"

$匹配一个输入或一行的结尾，/a$/匹配"An a"，而不匹配"an A"

*匹配前面元字符0次或多次，/ba*/将匹配b,ba,baa,baaa

+匹配前面元字符1次或多次，/ba+/将匹配ba,baa,baaa

?匹配前面元字符0次或1次，/ba?/将匹配b,ba

(x)匹配x保存x在名为$1...$9的变量中

x|y匹配x或y

{n}精确匹配n次

{n,}匹配n次以上

{n,m}匹配n-m次

[xyz]字符集(characterset)，匹配这个集合中的任一一个字符(或元字符)

[^xyz]不匹配这个集合中的任何一个字符

[\b]匹配一个退格符

\b匹配一个单词的边界

\B匹配一个单词的非边界

\cX这儿，X是一个控制符，/\cM/匹配Ctrl-M

\d匹配一个字数字符，/\d/=/[0-9]/

\D匹配一个非字数字符，/\D/=/[^0-9]/

\n匹配一个换行符

\r匹配一个回车符

\s匹配一个空白字符，包括\n,\r,\f,\t,\v等

\S匹配一个非空白字符，等于/[^\n\f\r\t\v]/

\t匹配一个制表符

\v匹配一个重直制表符

\w匹配一个可以组成单词的字符(alphanumeric，这是我的意译，含数字)，包括下划线，如[\w]匹配"$5.98"中的5，等于[a-zA-Z0-9]

\W匹配一个不可以组成单词的字符，如[\W]匹配"$5.98"中的$，等于[^a-zA-Z0-9]。

巴特西

JavaScript正则实战

1. javascript 正则对象替换创建和用法：/pattern/flags 先简单案例学习认识下replace能干什么

2. 学习最常用的 test exec match search replace split 6个方法

3. 常用表达式收集：

4. 正则表达式基础知识

最新文章

热门文章

巴特西

JavaScript正则实战

1. javascript 正则对象替换创建 和用法：/pattern/flags 先简单案例学习认识下replace能干什么

2. 学习最常用的 test exec match search replace split 6个方法

3. 常用表达式收集：

4. 正则表达式基础知识

最新文章

热门文章

1. javascript 正则对象替换创建和用法：/pattern/flags 先简单案例学习认识下replace能干什么