将标签中的下一个文本换行

Question

有没有动态的方法来包装下一个文本。

<p>Enterprise integration platform</p>

预期产量：

<p>Enterprise <span>integration</span> platform</p>

我需要包装将出现在“企业”之后的所有文本

Answer 1

此代码将查找所有出现的带有单词Enterprise的段落。 如果单词可以在其他单词之后出现，则需要更多处理

 $("p:contains('Enterprise')").html(function() { var texts = this.textContent.split(" "); return texts.shift()+" <span>"+texts.shift()+"</span> "+texts.join(" "); }); 

 span { color:red } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <p>Some stuff:</p> <p>Enterprise integration platform</p> <p>Enterprise architecture</p> <p>Enterprise service as a service</p> 

Answer 2

 var elements = document.querySelectorAll("p"); for (var i = 0; i < elements.length; i++) { var element = elements[i]; element.innerHTML = element.innerText.replace(/Enterprise (\\S+)/, "Enterprise <span>$1</span>"); } 

 /* just style to highlight span */ span { background-color: red; } 

 <p>Enterprise integration platform</p> 

请注意，此正则表达式将仅替换Enterprise第一个匹配项，如果需要替换所有匹配项，则需要添加g后缀： /Enterprise (\\S+)/g 。

我在这里使用正则表达式，我可以在这里解释

• Enterprise -显然搜索Enterprise文本。
• \\S+ —搜索一个或多个非空白字符。
• (\\S+) -捕获此非空白字符组以使用$1替换。

如果需要不区分大小写的Enterprise搜索，则应将替换运算符重写为.replace(/(enterprise) (\\S+)/i, "$1 <span>$2</span>") 。

请注意，我使用i后缀进行不区分大小写的搜索并捕获enterprise字词，因为在任何情况下都可以。