uniapp 处理后台返回的数据带有dom节点加上类名

给大家看一下我的后台返回的数据

如图所示 除了p标签 还包括一些img标签 一般来讲处理这样的数据的一种方法就是使用v-html亦或是富文本标签 但是我的需求是想给这里的p标签和img标签加上class类名设置单独的样式 以及设置图片的宽高

主要使用的是正则

var info = res.Data[0].ziliao
							.replace(/<p([\s\w"=\/\.:;]+)((?:(style="[^"]+")))/ig, '<p')
							.replace(/<p([\s\w"=\/\.:;]+)((?:(class="[^"]+")))/ig, '<p')
							.replace(/<p>/ig, '<p class="p_class">')

							.replace(/<img([\s\w"-=\/\.:;]+)((?:(height="[^"]+")))/ig, '<img$1')
							.replace(/<img([\s\w"-=\/\.:;]+)((?:(width="[^"]+")))/ig, '<img$1')
							.replace(/<img([\s\w"-=\/\.:;]+)((?:(style="[^"]+")))/ig, '<img$1')
							.replace(/<img([\s\w"-=\/\.:;]+)((?:(alt="[^"]+")))/ig, '<img$1')
							.replace(/<img([\s\w"-=\/\.:;]+)/ig, '<img$1 class="pho"')

效果：

在微信小程序运行起来的时候检查元素会发现已经给p标签和img标签加上了类名 这样我们就可以随意设置他们的样式了

最后的效果图