首页 > > 网页制作 > Javascript >

小刘同学的第三篇博文

2018-06-24 01:09:10来源：未知阅读 ()

本想多留点时间写博文的，但是无奈被诸多琐事缠身，实际上也没那么多事，主要是自己可能分不太清时间轻重吧。

以后在9点开始写博文，或者中午的时候，反正空下来就写写。

（醉了，我也是才知道博客里面可以直接粘贴图片，不用插入就行。。。。。）

又是一个很有意思的正则问题，刚开始的时候，总是纠结在sss和ddd和ccc总得出现一个吧，但是实际上是

才是我所想的表达式

在外面再加一个括号，才是sss、ddd、ccc三选一

而不加括号就像注释中写的一样，只是匹配三个连续字符，所以^和$都不在有什么作用了，其实不写也可以。

刚开始总是觉得这个图有点奇怪，表达不出我想要的意思，其实现在也想的不是很明白，仅仅只是大概就是，一路匹配过去这样的意思吧，匹配到三个连续字符的时候就行了。

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>homework7</title>
 6 </head>
 7 <body>
 8 <!-- 
 9 /**
10  * @author: xiaoliu
11  * @type: homework
12  * @data: 2017-12-25
13  * @finish: 2017-12-26
14  */
15  -->
16 <script>    
17     var html = '<tr><th style="width:30%">方法</th><th>描述</th></tr><tr><td><a href="/jsref/jsref_anchor.asp">anchor()</a></td><td>创建 HTML 锚。</td></tr><tr><td><a href="/jsref/jsref_big.asp">big()</a></td><td>用大号字体显示字符串。</td></tr><tr><td><a href="/jsref/jsref_blink.asp">blink()</a></td><td>显示闪动字符串。</td></tr><tr><td><a href="/jsref/jsref_bold.asp">bold()</a></td><td>使用粗体显示字符串。</td></tr><tr><td><a href="/jsref/jsref_charAt.asp">charAt()</a></td><td>返回在指定位置的字符。</td></tr><tr><td><a href="/jsref/jsref_charCodeAt.asp">charCodeAt()</a></td><td>返回在指定的位置的字符的 Unicode 编码。</td></tr><tr><td><a href="/jsref/jsref_concat_string.asp">concat()</a></td><td>连接字符串。</td></tr><tr><td><a href="/jsref/jsref_fixed.asp">fixed()</a></td><td>以打字机文本显示字符串。</td></tr><tr><td><a href="/jsref/jsref_fontcolor.asp">fontcolor()</a></td><td>使用指定的颜色来显示字符串。</td></tr><tr><td><a href="/jsref/jsref_fontsize.asp">fontsize()</a></td><td>使用指定的尺寸来显示字符串。</td></tr><tr><td><a href="/jsref/jsref_fromCharCode.asp">fromCharCode()</a></td><td>从字符编码创建一个字符串。</td></tr><tr><td><a href="/jsref/jsref_indexOf.asp">indexOf()</a></td><td>检索字符串。</td></tr><tr><td><a href="/jsref/jsref_italics.asp">italics()</a></td><td>使用斜体显示字符串。</td></tr><tr><td><a href="/jsref/jsref_lastIndexOf.asp">lastIndexOf()</a></td><td>从后向前搜索字符串。</td></tr><tr><td><a href="/jsref/jsref_link.asp">link()</a></td><td>将字符串显示为链接。</td></tr><tr><td><a href="/jsref/jsref_localeCompare.asp">localeCompare()</a></td><td>用本地特定的顺序来比较两个字符串。</td></tr><tr><td><a href="/jsref/jsref_match.asp">match()</a></td><td>找到一个或多个正则表达式的匹配。</td></tr><tr><td><a href="/jsref/jsref_replace.asp">replace()</a></td><td>替换与正则表达式匹配的子串。</td></tr><tr><td><a href="/jsref/jsref_search.asp">search()</a></td><td>检索与正则表达式相匹配的值。</td></tr><tr><td><a href="/jsref/jsref_slice_string.asp">slice()</a></td><td>提取字符串的片断，并在新的字符串中返回被提取的部分。</td></tr><tr><td><a href="/jsref/jsref_small.asp">small()</a></td><td>使用小字号来显示字符串。</td></tr><tr><td><a href="/jsref/jsref_split.asp">split()</a></td><td>把字符串分割为字符串数组。</td></tr><tr><td><a href="/jsref/jsref_strike.asp">strike()</a></td><td>使用删除线来显示字符串。</td></tr><tr><td><a href="/jsref/jsref_sub.asp">sub()</a></td><td>把字符串显示为下标。</td></tr><tr><td><a href="/jsref/jsref_substr.asp">substr()</a></td><td>从起始索引号提取字符串中指定数目的字符。</td></tr><tr><td><a href="/jsref/jsref_substring.asp">substring()</a></td><td>提取字符串中两个指定的索引号之间的字符。</td></tr><tr><td><a href="/jsref/jsref_sup.asp">sup()</a></td><td>把字符串显示为上标。</td></tr><tr><td><a href="/jsref/jsref_toLocaleLowerCase.asp">toLocaleLowerCase()</a></td><td>把字符串转换为小写。</td></tr><tr><td><a href="/jsref/jsref_toLocaleUpperCase.asp">toLocaleUpperCase()</a></td><td>把字符串转换为大写。</td></tr><tr><td><a href="/jsref/jsref_toLowerCase.asp">toLowerCase()</a></td><td>把字符串转换为小写。</td></tr><tr><td><a href="/jsref/jsref_toUpperCase.asp">toUpperCase()</a></td><td>把字符串转换为大写。</td></tr><tr><td>toSource()</td><td>代表对象的源代码。</td></tr><tr><td><a href="/jsref/jsref_toString_string.asp">toString()</a></td><td>返回字符串。</td></tr><tr><td><a href="/jsref/jsref_valueOf_string.asp">valueOf()</a></td><td>返回某个字符串对象的原始值。</td></tr></tbody>'
18 
19     var test = '<tr><td><a href="/jsref/jsref_anchor.asp">anchor()</a></td><td>创建 HTML 锚。</td></tr>';
20     //注意anchor() （）也是关键字，需要转义
21     var regex = /<tr><td><a href="([^"]+)">([^<]+)<\/a><\/td><td>([^<]+)<\/td><\/tr>/g;
22     // if (regex.exec(test)) {
23     //     alert("匹配成功");
24     // } else{
25     //     alert("error");
26     // }
27     var count = 1;
28     while(regex.exec(html)){
29         console.log("链接：http:/" + RegExp.$1);
30         console.log("API函数：" + RegExp.$2);
31         console.log("描述：" + RegExp.$3);
32         console.log("============第" + count + "个============");
33         count++;
34     }
35 </script>
36 </body>
37 </html>

原本是不行插入代码的，这个插入的代码简直其丑无比，无奈截不下那么大的图，而且时间已经很晚了，就这样将就了吧。

主要还是这个 "([^"]+)" 这种写法完全没有想到，现在想来的确有妙用，特别是老师说的匹配中文字符的时候，只要匹配下一个不是引号的字符就行。

这是结果的一小部分截图

其实这个结果我也是调试了很久才写出来的，之前一直把最关键的g给漏掉了，导致while死循环了，虽然浏览器崩了，但是还是能看到结果，都是重复的第一个，其实当时也没注意到，结果是一直重复第一个，我还以为是while循环写错了，后面还特意去改写了for循环，想就先写死50个，看看结果怎么样，但是发现还是不行，无奈后面其实是比对老师的代码，才意识到是全局匹配的问题，是个大教训，留个图