如何在纯 JavaScript 中使用正则表达式多次匹配 XML 标签？

Question

我有以下 XML 文档，它表示来自公交车站的 API 呼叫：

<?xml version="1.0" encoding="utf-8"?>
<ArrayOfPolling xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">
  <Polling>
    <id>1494</id>
    <name>Street xyz</name>
    <time>14.08</time>
    <line>AB2</line>
    <timeMin>5</timeMin>
  </Polling>
  <Polling>
    <id>1494</id>
    <name>Street xyz</name>
    <time>14.10</time>
    <line>140</line>
    <timeMin>7</timeMin>
  </Polling>
  <Polling>
    <id>1494</id>
    <name>Street xyz</name>
    <time>14.12</time>
    <line>AB2</line>
    <timeMin>9</timeMin>
  </Polling>
  <Polling>
    <id>1494</id>
    <name>Street xyz</name>
    <time>14.15</time>
    <line>140</line>
    <timeMin>12</timeMin>
  </Polling>
</ArrayOfPolling>

我需要以纯 JavaScript、无 jQuery、无 xml2json 等方式获取此信息。所以我选择继续match()，但是我对正则表达式了解不多。例如，我尝试使用 <name>(.+?)<\/name>,<line>(.+?)<\/line> 等，但我不知道如何迭代并将所有内容放入数组中。

你能给我点灯吗？

Answer 1

var re = /<id>(.+?)<\/id>|<name>(.+?)<\/name>|<time>(.+?)<\/time>|<line>(.+?)<\/line>|<timeMin>(.+?)<\/timeMin>/g; 
    var str = '<?xml version="1.0" encoding="utf-8"?>\n<ArrayOfPolling xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">\n  <Polling>\n    <id>1494</id>\n    <name>Street xyz</name>\n    <time>14.08</time>\n    <line>AB2</line>\n    <timeMin>5</timeMin>\n  </Polling>\n  <Polling>\n    <id>1494</id>\n    <name>Street xyz</name>\n    <time>14.10</time>\n    <line>140</line>\n    <timeMin>7</timeMin>\n  </Polling>\n  <Polling>\n    <id>1494</id>\n    <name>Street xyz</name>\n    <time>14.12</time>\n    <line>AB2</line>\n    <timeMin>9</timeMin>\n  </Polling>\n  <Polling>\n    <id>1494</id>\n    <name>Street xyz</name>\n    <time>14.15</time>\n    <line>140</line>\n    <timeMin>12</timeMin>\n  </Polling>\n</ArrayOfPolling>';
    var m;
    var result ="";
    
    while ((m = re.exec(str)) !== null) {
        if (m.index === re.lastIndex) {
            re.lastIndex++;
        }
        // View your result using the m-variable.
        // eg m[0] etc.
        if(undefined != m[1]) result += "id: " + m[1] + "</br>";
        if(undefined != m[2]) result += "name: " + m[2] + "</br>";
        if(undefined != m[3]) result +=  "time: " + m[3] + "</br>";
        if(undefined != m[4]) result += "line: " + m[4] + "</br>";
        if(undefined != m[5]) result += "timeMin: " + m[5] + "</br>";
        
    }
document.getElementById("results").innerHTML = result;

<div id="results"></div>

你可以使用它（它只打印，你也可以存储在一个数组中）：

var re = /<id>(.+?)<\/id>|<name>(.+?)<\/name>|<time>(.+?)<\/time>|<line>(.+?)<\/line>|<timeMin>(.+?)<\/timeMin>/g; 
var str = '<?xml version="1.0" encoding="utf-8"?>\n<ArrayOfPolling xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">\n  <Polling>\n    <id>1494</id>\n    <name>Street xyz</name>\n    <time>14.08</time>\n    <line>AB2</line>\n    <timeMin>5</timeMin>\n  </Polling>\n  <Polling>\n    <id>1494</id>\n    <name>Street xyz</name>\n    <time>14.10</time>\n    <line>140</line>\n    <timeMin>7</timeMin>\n  </Polling>\n  <Polling>\n    <id>1494</id>\n    <name>Street xyz</name>\n    <time>14.12</time>\n    <line>AB2</line>\n    <timeMin>9</timeMin>\n  </Polling>\n  <Polling>\n    <id>1494</id>\n    <name>Street xyz</name>\n    <time>14.15</time>\n    <line>140</line>\n    <timeMin>12</timeMin>\n  </Polling>\n</ArrayOfPolling>';
var m;

while ((m = re.exec(str)) !== null) {
    if (m.index === re.lastIndex) {
        re.lastIndex++;
    }
    // View your result using the m-variable.
    // eg m[0] etc.
    if(undefined != m[1]) console.log("id: " + m[1]);
    if(undefined != m[2]) console.log("name: " + m[2]);
    if(undefined != m[3]) console.log("time: " + m[3]);
    if(undefined != m[4]) console.log("line: " + m[4]);
    if(undefined != m[5]) console.log("timeMin: " + m[5]);
}

输出：

id: 1494
name: Street xyz
time: 14.08
line: AB2
timeMin: 5
id: 1494
name: Street xyz
time: 14.10
line: 140
timeMin: 7
id: 1494
name: Street xyz
time: 14.12
line: AB2
timeMin: 9
id: 1494
name: Street xyz
time: 14.15
line: 140
timeMin: 12

DEMO - RegExp

DEMO - js

基本上你会select每次迭代使用捕获组匹配的元素

如何在纯 JavaScript 中使用正则表达式多次匹配 XML 标签？

How do I match XML tags multiple times with regexp in pure JavaScript?

javascript

regex

xml

string-matching