正则表达式javascript无法按预期工作

时间:2015-07-24 22:58:06

标签: javascript regex

我在线编写并测试了以下正则表达式。

正则表达式:/>([^<]*)<\//g

测试字符串:<td style="text-align: center;">31</td><td style="text-align: center;">14</td><td style="text-align: center;">opened</td><td style="text-align: center;">receiver</td><td style="text-align: center;">elro_800_contact</td><td style="text-align: center;">0000-e8-de-27-176d10</td><td style="text-align: center;">6</td>

经过测试和running it online。它返回以下匹配项:

MATCH 1
1.  [32-34] `31`
MATCH 2
1.  [71-73] `14`
MATCH 3
1.  [110-116]   `opened`
MATCH 4
1.  [153-161]   `receiver`
MATCH 5
1.  [198-214]   `elro_800_contact`
MATCH 6
1.  [251-271]   `0000-e8-de-27-176d10`
MATCH 7
1.  [308-309]   `6`

但是,当我通过以下代码运行它时:

function parseTableNewDevice(str) {
        var regexSearchExpression = />([^<]*)<\//g;
        var regexResultAddDevice;

        while ((regexResultAddDevice = regexSearchExpression.exec(str)) !== null) {
            if (regexResultAddDevice.index === regexSearchExpression.lastIndex) {
                regexSearchExpression.lastIndex++;
            }
            // View your result using the regexResultAddDevice-variable.
            // eg regexResultAddDevice[0] etc.
            console.log(regexResultAddDevice);
        }
}

它返回:

[">31</", "31", index: 31, input: "<td style="text-align: center;">31</td><td style="…6d10</td><td style="text-align: center;">323</td>"]0: ">31</"1: "31"index: 31input: "<td style="text-align: center;">31</td><td style="text-align: center;">14</td><td style="text-align: center;">on</td><td style="text-align: center;">receiver</td><td style="text-align: center;">pollin</td><td style="text-align: center;">0000-e8-de-27-176d10</td><td style="text-align: center;">323</td>"length: 2__proto__: Array[0]
index.html:65 
[">14</", "14", index: 70, input: "<td style="text-align: center;">31</td><td style="…6d10</td><td style="text-align: center;">323</td>"]0: ">14</"1: "14"index: 70input: "<td style="text-align: center;">31</td><td style="text-align: center;">14</td><td style="text-align: center;">on</td><td style="text-align: center;">receiver</td><td style="text-align: center;">pollin</td><td style="text-align: center;">0000-e8-de-27-176d10</td><td style="text-align: center;">323</td>"length: 2__proto__: Array[0]
    index.html:65 
[">on</", "on", index: 109, input: "<td style="text-align: center;">31</td><td style="…6d10</td><td style="text-align: center;">323</td>"]0: ">on</"1: "on"index: 109input: "<td style="text-align: center;">31</td><td style="text-align: center;">14</td><td style="text-align: center;">on</td><td style="text-align: center;">receiver</td><td style="text-align: center;">pollin</td><td style="text-align: center;">0000-e8-de-27-176d10</td><td style="text-align: center;">323</td>"length: 2__proto__: Array[0]
    index.html:65 
[">receiver</", "receiver", index: 148, input: "<td style="text-align: center;">31</td><td style="…6d10</td><td style="text-align: center;">323</td>"]0: ">receiver</"1: "receiver"index: 148input: "<td style="text-align: center;">31</td><td style="text-align: center;">14</td><td style="text-align: center;">on</td><td style="text-align: center;">receiver</td><td style="text-align: center;">pollin</td><td style="text-align: center;">0000-e8-de-27-176d10</td><td style="text-align: center;">323</td>"length: 2__proto__: Array[0]
    index.html:65 
[">pollin</", "pollin", index: 193, input: "<td style="text-align: center;">31</td><td style="…6d10</td><td style="text-align: center;">323</td>"]0: ">pollin</"1: "pollin"index: 193input: "<td style="text-align: center;">31</td><td style="text-align: center;">14</td><td style="text-align: center;">on</td><td style="text-align: center;">receiver</td><td style="text-align: center;">pollin</td><td style="text-align: center;">0000-e8-de-27-176d10</td><td style="text-align: center;">323</td>"length: 2__proto__: Array[0]
    index.html:65 
[">0000-e8-de-27-176d10</", "0000-e8-de-27-176d10", index: 236, input: "<td style="text-align: center;">31</td><td style="…6d10</td><td style="text-align: center;">323</td>"]0: ">0000-e8-de-27-176d10</"1: "0000-e8-de-27-176d10"index: 236input: "<td style="text-align: center;">31</td><td style="text-align: center;">14</td><td style="text-align: center;">on</td><td style="text-align: center;">receiver</td><td style="text-align: center;">pollin</td><td style="text-align: center;">0000-e8-de-27-176d10</td><td style="text-align: center;">323</td>"length: 2__proto__: Array[0]
    index.html:65 
[">323</", "323", index: 293, input: "<td style="text-align: center;">31</td><td style="…6d10</td><td style="text-align: center;">323</td>"]0: ">323</"1: "323"index: 293input: "<td style="text-align: center;">31</td><td style="text-align: center;">14</td><td style="text-align: center;">on</td><td style="text-align: center;">receiver</td><td style="text-align: center;">pollin</td><td style="text-align: center;">0000-e8-de-27-176d10</td><td style="text-align: center;">323</td>"length: 2__proto__: Array[0]
    index.html:69 
Uncaught TypeError: Cannot read property '1' of nullparseTableNewDevice @ index.html:69(anonymous function) @ index.html:52p.event.dispatch @ jquery.min.js:2p.event.add.g.handle.h @ jquery.min.js:2

这很奇怪,因为它完全不同于我从regex101.com获得的预期结果。

如果我然后尝试读取console.log(regexResultAddDevice [0])的值,我得到Uncaught TypeError: Cannot read property '0' of null。但它应该返回31。

我是javascript的新手,在php中我总是使用变量[0]来获取数组的第一个值,但是这似乎并不适用于javascript。

2 个答案:

答案 0 :(得分:3)

不是使用正则表达式,而是使用DOM Parser解析字符串并只读取innerHTML:

var str = '<td style="text-align: center;">31</td><td style="text-align: center;">14</td><td style="text-align: center;">opened</td><td style="text-align: center;">receiver</td><td style="text-align: center;">elro_800_contact</td><td style="text-align: center;">0000-e8-de-27-176d10</td><td style="text-align: center;">6</td>',
    xmlString = '<tr>' + str + '</tr>', 
    parse = new DOMParser(), 
    doc = parse.parseFromString(xmlString, "text/xml");
var tds = doc.firstChild.querySelectorAll('td');

for (var i=0;i<tds.length;i++) {
  console.log(tds[i].innerHTML);
}

答案 1 :(得分:1)

你的代码似乎工作正常。这是一个为每个regexResultAddDevice[1]

调用警报的示例

function parseTableNewDevice(str) {
        var regexSearchExpression = />([^<]*)<\//g;
        var regexResultAddDevice;

        while ((regexResultAddDevice = regexSearchExpression.exec(str)) !== null) {
            if (regexResultAddDevice.index === regexSearchExpression.lastIndex) {
                regexSearchExpression.lastIndex++;
            }
            // View your result using the regexResultAddDevice-variable.
            // eg regexResultAddDevice[0] etc.
            //alert(JSON.stringify(regexResultAddDevice, null, 4));
            alert(regexResultAddDevice[1]);
        }
}

var testStr = '<td style="text-align: center;">31</td><td style="text-align: center;">14</td><td style="text-align: center;">opened</td><td style="text-align: center;">receiver</td><td style="text-align: center;">elro_800_contact</td><td style="text-align: center;">0000-e8-de-27-176d10</td><td style="text-align: center;">6</td>';
parseTableNewDevice(testStr);

话虽这么说,我建议采用@michael概述的方法,因为它会更可靠地解析html并提供你想要的信息