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

时间:2017-05-02 15:14:44

标签: javascript html regex

我想用<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>

2 个答案:

答案 0 :(得分:2)

以下正则表达式与<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;

答案 1 :(得分:0)

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

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数组将原始段落放入按照拆分规范分组的数组中