富文本展示页面,从后端获取到富文本数据,经过formatRichText方法进行调整
formatRichText方法
formatRichText(html) {
let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) {
match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
return match;
});
newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) {
match = match
.replace(/<p>/gi, '<p class="p_class">')
.replace(/width:[^;]+;/gi, 'max-width:100%;')
.replace(/width:[^;]+;/gi, 'max-width:100%;');
return match;
});
newContent = newContent.replace(/<br[^>]*\/>/gi, "");
newContent = newContent.replace(/<a>/gi, '<a class="p_class "');
newContent = newContent.replace(/<li>/gi, '<li class="p_class "');
newContent = newContent.replace(/\<p/gi, '<p class="p_class "');
newContent = newContent.replace(/\<span/gi, '<span class="p_class "');
newContent = newContent.replace(/\<img/gi,
'<img style="max-width:100%;height:auto;display:block;margin-top:0;margin-bottom:0;"');
return newContent;
}