Question

我是正则表达式的新手。我想按顺序存储HTML中的特定匹配，以便在数组匹配中存储case id。

使用的正则表达式

{/\<strong\>Creative:\<\/strong\>[^\[]+\[ID: ([0-9]+)\]/g}

在HTML中获得以下匹配。

<div><p>Hello,</p> <p>For the following campaign: </p><div style="margin-left:50px"><strong>Account:</strong> Mediaschneider [ID: 25077545] <br> <strong>Advertiser:</strong> Swisscom RES (PlanNet) [ID: 37666830] <br> <strong>Campaign:</strong> R11600027_TV-Features [ID: 43147398]</div><p></p> <p>...the following creatives have been published to QA and are ready for review:</p><div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x415-<wbr>HTML5-N-DE [ID: 43599777] <br> <strong>Format/Dimensions:</strong> INPAGE[320x415]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x415-<wbr>HTML5-N-FR [ID: 43623313] <br> <strong>Format/Dimensions:</strong> INPAGE[320x415]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x415-<wbr>HTML5-N-IT [ID: 43622995] <br> <strong>Format/Dimensions:</strong> INPAGE[320x415]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x416-<wbr>HTML5-N-DE [ID: 43623820] <br> <strong>Format/Dimensions:</strong> INPAGE[320x416]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x416-<wbr>HTML5-N-FR [ID: 43623371] <br> <strong>Format/Dimensions:</strong> INPAGE[320x416]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x416-<wbr>HTML5-N-IT [ID: 43623824] <br> <strong>Format/Dimensions:</strong> INPAGE[320x416]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubelnAZ_<wbr>branding-MobINSTI-320x460-<wbr>HTML5-N-DE [ID: 43624100] <br> <strong>Format/Dimensions:</strong> INPAGE[320x460]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubelnAZ_<wbr>branding-TabINSTI-1024x500-<wbr>HTML5-N-DE [ID: 43623840] <br> <strong>Format/Dimensions:</strong> INPAGE

我的广告素材ID不止一个匹配，因此我需要将唯一的广告素材ID号存储为以下数组

var case_id's = ['43623313','12345678', etc, etc];

我怎样才能获得阵列中的那些？

Answer 1

您可以使用带有回调函数的replace来获取数组。什么都没有被替换，但它是一种收集被捕获组的好方法。

对于正则表达式，您可以使用：

/\>Creative:\<.*?(\d+)\]/gm

注意括号，表示您要收集的部分。

以下是执行此操作的JavaScript代码：

＆＃13;

// Sample data as provided in the question:
var html = `<div><p>Hello,</p> <p>For the following campaign: </p><div style="margin-left:50px"><strong>Account:</strong> Mediaschneider [ID: 25077545] <br> <strong>Advertiser:</strong> Swisscom RES (PlanNet) [ID: 37666830] <br> <strong>Campaign:</strong> R11600027_TV-Features [ID: 43147398]</div><p></p> <p>...the following creatives have been published to QA and are ready for review:</p><div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x415-<wbr>HTML5-N-DE [ID: 43599777] <br> <strong>Format/Dimensions:</strong> INPAGE[320x415]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x415-<wbr>HTML5-N-FR [ID: 43623313] <br> <strong>Format/Dimensions:</strong> INPAGE[320x415]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x415-<wbr>HTML5-N-IT [ID: 43622995] <br> <strong>Format/Dimensions:</strong> INPAGE[320x415]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x416-<wbr>HTML5-N-DE [ID: 43623820] <br> <strong>Format/Dimensions:</strong> INPAGE[320x416]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x416-<wbr>HTML5-N-FR [ID: 43623371] <br> <strong>Format/Dimensions:</strong> INPAGE[320x416]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x416-<wbr>HTML5-N-IT [ID: 43623824] <br> <strong>Format/Dimensions:</strong> INPAGE[320x416]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubelnAZ_<wbr>branding-MobINSTI-320x460-<wbr>HTML5-N-DE [ID: 43624100] <br> <strong>Format/Dimensions:</strong> INPAGE[320x460]<br> <strong>Mode: </strong> HTML5</p></div> <div style="margin-left:50px"><p><strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubelnAZ_<wbr>branding-TabINSTI-1024x500-<wbr>HTML5-N-DE [ID: 43623840] <br> <strong>Format/Dimensions:</strong> INPAGE`;

// Show the HTML (just for fun):
document.body.innerHTML = html;

// collect the ID values
case_ids = [];
html.replace(/\>Creative:\<.*?(\d+)\]/gm, function (_, num) {
    case_ids.push(num);
});

console.log(case_ids);

＆＃13;

请注意，对于解析HTML，您通常不会使用正则表达式，但如果您的HTML不会比这更复杂，那么它是可行的。

Answer 2

您可以使用以下代码来实现输出。

<scirpt>
var re = /\<strong\>Creative:\<\/strong\>[^\[]+\[ID: ([0-9]+)\]/g; 
var str = '<strong>Creative:</strong> R11600027-TV <wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x415-<wbr>HTML5-N-FR [ID: 43623313] \n<strong>Creative:</strong> R11600027-TV-<wbr>FeaturesInnovationenJubeln20mi<wbr>n_branding-MobINSTI-320x415-<wbr>HTML5-N-FR [ID: 456223]';
var caseid=[];
while ((m = re.exec(str)) !== null) {
caseid.push(m[1]);
}
console.log(caseid);
</script>

如何使用正则表达式查找第一个匹配项

2 个答案: