0

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

我需要使用正则表达式,因为这个 html 文本将像文本一样被处理,而不像 DOM estrucutre

<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 转换为此,我需要像文本一样解析 firt 以跳过 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

4

4 回答 4

4

不要使用正则表达式来解析 HTML。改用 DOM。如果您有纯字符串,请创建一个DocumentFragment并将其分配给它.innerHTML以获取 DOM。

用找到您的p标签getElementsByTagName,检查它们.className并采取相应措施。

于 2012-08-07T15:58:06.973 回答
0

你有没有想过使用 JQuery?

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

这将<p>用“替换值在此处”替换的内容

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

于 2012-08-07T15:56:57.277 回答
0

不建议使用正则表达式解析 HTML。您可以使用 XPath 获取<p>具有指定条件的所有内容,并遍历返回的列表并更新textContent每个<p>内容,如下面的代码片段所示。

var pList = document.evaluate("//p[@class='page-break']", document, null, XPathResult.ANY_TYPE, null);   
var item = pList.iterateNext();  
while (item) {  
    item.textContent = "New Text";
    item = pList.iterateNext();  
}

解释

//p[@class='page-break']将获取所有<p>带有class='page-break'. document.evaluate函数将返回您类型的对象XPathResult。使用interateNext()函数你可以得到它的元素。textContent您可以使用属性设置新文本。

于 2012-08-07T16:04:09.593 回答
0
// 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>");

例子

于 2012-08-07T17:14:15.963 回答