[英]Replacing HTML String & Avoiding Tags (regex)
I'm trying to use JS to replace a specific string within a string that contains html tags+attributes and styles while avoiding the inner side of the tags to be read or matched (and keep the original tags in the text). 我正在尝试使用JS替换包含html标签+属性和样式的字符串中的特定字符串,同时避免标签的内侧被读取或匹配(并在文本中保留原始标签)。
for example, I want <span> this is span text </span>
to be become: <span> this is s<span class="found">pan</span> text </span>
when the keyword is "pan" 例如,我希望<span> this is span text </span>
成为: <span> this is s<span class="found">pan</span> text </span>
当关键字为“ pan”时<span> this is s<span class="found">pan</span> text </span>
”
I tried using regex with that .. My regex so far: 我尝试过使用正则表达式..到目前为止,我的正则表达式:
$(this).html($(this).html().replace(new RegExp("([^<\"][a-zA-Z0-9\"'\=;:]*)(" + search + ")([a-zA-Z0-9\"'\=;:]*[^>\"])", 'ig'), "$1<span class='found'>$2</span>$3"));
This regex only fails in cases like <span class="myclass"> span text </span>
when the search="p", the result: 仅当诸如<span class="myclass"> span text </span>
情况下,此正则表达式才会失败,当search =“ p”时,结果为:
<s<span class="found">p</span>an class="myclass"> s<span class="found">p</span>an text</s<span class="found">p</span>an>
*this topic should help anyone who seeks to find a match and replace the matched string while avoiding strings surrounded by specific characters to be replaced. *本主题应为任何寻求匹配并替换匹配字符串的人提供帮助,同时避免替换由特定字符包围的字符串。
Do not use regexes with html, traverse and manipulate the DOM instead: 不要将正则表达式与html一起使用,而是遍历和操纵DOM:
doc = $('<div><span class="myclass"> span text </span></div>')
$(doc).find("*").andSelf().contents().each(function() {
if(this.nodeType == 3)
$(this).replaceWith($(this).text().replace(/p/g, "<b>p</b>"))
})
console.log(doc.html())
// <span class="myclass"> s<b>p</b>an text </span>
If you insist on using regexes, it goes like this: 如果您坚持使用正则表达式,则如下所示:
text = '<span class="myclass"> <p>span</p> </span>'
found = 'p'
re = new RegExp(found + '(?=[^<>]*(<|$))', 'g')
text = text.replace(re, "<b>$&</b>")
console.log(text)
// <span class="myclass"> <p>s<b>p</b>an</p> </span>
As thg435 say, the good way to deal with html content is to use the DOM. 正如thg435所说,处理html内容的好方法是使用DOM。
But if you want to avoid something in a replace, you can match that you want to avoid first and replace it by itself. 但是,如果要避免替换,可以先匹配然后再替换。
Example to avoid html tags: 避免html标签的示例:
var text = '<span class="myclass"> span text </span>';
function callback(p1, p2) {
return ((p2==undefined)||p2=='')?p1:'<span class="found">'+p1+'</span>';
}
var result = text.replace(/<[^>]+>|(p)/g, callback);
alert(result);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.