正则表达式按标签分割HTML，文本包含少于n个字符

Question

我想用<p>个标签拆分以下字符串，这些标签包含少于4个字符的文本。让我们使用Regex说<p>1</p>，<p>2</p>。

<span id="_ctl0_contentMain__kDP_dp_Text" class="kDPText">
<p>1</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p>2</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
</span>

Answer 1

以下正则表达式与<p>...</p>匹配，标记之间最多包含三个字符：

<p>.{0,3}<\/p>

演示：

＆＃13;

＆＃13;

var input = `<span id="_ctl0_contentMain__kDP_dp_Text" class="kDPText">
<p>1</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p>2</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
</span>`;
console.log(input.split(/<p>.{0,3}<\/p>/));

＆＃13;

＆＃13;

＆＃13;

Answer 2

如果您想使用正则表达式，可以使用类似于此代码的内容。

var string_to_split= document.getElementById("_ctl0_contentMain__kDP_dp_Text").innerHTML
var your_regExp = new RegExp("<p>.{0,3}<\/p>","ig");
var result = string_to_split.split(your_regExp).filter(function(x) {return x.trim().length;});

如果您不想使用RegEx，您可以使用类似这样的脚本（仍然是vanilla javascript，但在较旧的浏览器[ie ie8]中，您会使用polyfill for querySelectorAll，我猜：< / p>

var allParagraph = document.querySelectorAll("#_ctl0_contentMain__kDP_dp_Text > p");
var split_para = Array.prototype.reduce.call(
    allParagraph,
    function(acc, x) { 
      if (x.innerHTML.length < 4) {
        acc.unshift([]);
      } else {
        acc[0].push(x);
      }
      return acc;
    },
    []
).reverse();

当然，第一个解决方案更简单但是在结果变量中有一个字符串，split_para数组将原始段落放入按照拆分规范分组的数组中