用于捕获标记的正则表达式

Question

我有以下html文本，在javascript中，我需要捕获所有具有"page-break“类的标签"p”，然后将其替换为任何文本。

我需要使用正则表达式，因为此html文本将被处理为文本，而不是DOM结构

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Praesent pellentesque tincidunt adipiscing</p>

<p class="page-break">break</p>

<p>Suspendisse a velit at diam facilisis
egestas sit amet a lectus.</p>

<p class="page-break">other</p>

<p>Donec tristique placerat massa vitae hendrerit. Maecenas nec
massa adipiscing sem venenatis vehicula. Suspendisse mattis pretium
libero quis dignissim. Nulla volutpat imperdiet vehicula. Donec ut
tristique neque.</p>

阻止我使用dom解析器是因为我计划插入一个无效的html元素，我计划将前面的HTML转换成这样，我需要先像文本一样解析以跳过html验证，然后像这样粘贴它。

 <div class="pag visible">
 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Praesent pellentesque tincidunt adipiscing</p>
 </div>
 <div class="pag">   
    <p>Suspendisse a velit at diam facilisis
    egestas sit amet a lectus.</p>
 </div>
 <div class="pag">   
    <p>Donec tristique placerat massa vitae hendrerit. Maecenas nec
    massa adipiscing sem venenatis vehicula. Suspendisse mattis pretium
    libero quis dignissim. Nulla volutpat imperdiet vehicula. Donec ut
    tristique neque.</p>
 </div>

正如您所看到的，每个".page-break“都被替换为ir

Answer 1

// your content
var content = '<p>Lorem ips...';
// to match any <p> with correspondent class
var regex = /(<p class.?=.?"page-break">.*<\/p>)+/g;
// to replace it with whatever you need:
content.replace(regex, "<p>MY TEXT HERE</p>");

Example

Answer 2

Don't use regexp to parse HTML。请改用DOM。如果您有普通字符串，则创建一个DocumentFragment并将其分配给它的.innerHTML以获取DOM。

用getElementsByTagName找到你的p标签，检查它们的.className并采取相应的行动。

Answer 3

你有没有想过使用JQuery？

$('p').hasClass('page-break').html('replacement value goes here');

这将把<p>的内容替换为“replace value goes here”

否则$('p').hasClass('page-break').remove();将完全删除<p>元素。